Threejs：PointCloudMaterial 大小与 ShaderMaterial gl_PointSize 相比，具有大小衰减

Question

我很想知道gl_PointSize和 中的 size 属性之间有什么关系PointCloudMaterial。

当我创建PointCloudwithPointCloudMaterial并将属性设置size为时1，粒子的大小远大于创建PointCloudwith aShaderMaterial并将顶点着色器的大小参数设置为 时的大小1。我还像在着色器中一样考虑了尺寸衰减PointCloudMaterial：

<script type="x-shader/x-vertex" id="particle_vs">
    uniform float size;
    uniform float scale;
    void main() {
        vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
        gl_PointSize = size * ( scale / length( mvPosition.xyz ) );
        gl_Position = projectionMatrix * mvPosition;
    }
</script>

我在这里提取了我的问题的一个简单示例： http: //dev.cartelle.nl/article-example/

• 红色粒子被指定PointCloudMaterial为 size 的集合1。
• 绿色粒子被指定为 a ，其具有考虑尺寸衰减的ShaderMateriala ，如 中所示。在这种情况下，我将 设为，正如您所看到的，绿色颗粒仍然较小。Vertex ShaderPointCloudMaterialsize300

我的预期结果是采用ShaderMaterial与 上的 size 属性相同的单位度量PointCloudMaterial。我必须让这两种材料一起工作，所以我试图找出这些尺寸之间的关系。一定是我在顶点着色器中缺少的东西吗？

谢谢！约翰尼

Answer 1

在你的ShaderMaterial，你需要设置

scale: { type: 'f', value: window.innerHeight / 2 },

这是因为WebGLRenderer方法中的以下行refreshUniformsParticle()：

uniforms.scale.value = _canvas.height / 2.0; // TODO: Cache this.

三.js r.71