Three.js 通过具有透明度的 pointCloudMaterial 纹理看不到一些对象

Question

我正在尝试在三个场景中移动粒子 (THREE.PointCloud)。这个粒子是由这个 material 和透明 png 组成的。

var material = new     THREE.PointCloudMaterial( { 
        size: tamanio,
        color:color, 
        //alphaTest:0.01,
        transparent:true,
        depthTest:true,
        map:recursoConNombre("textura_particula").objeto,
        blending:THREE.AdditiveBlending         
    });

一切似乎都还好，但有些物体无法通过粒子的透明纹理看到。 Image of the problem, particles with transparent textsure红圈的三个粒子在同一个PointCloud对象中，有些对象没有透过纹理看到（右边两个是错误的）。

编辑：我创建了一个 Fiddle 来重现该问题，一些球体无法通过一些透明粒子看到：http://jsfiddle.net/g68jbsoy/1/（鼠标单击以创建粒子爆炸）

Answer 1

这是由于点云的透明度以及渲染顺序不正确造成的。

渲染透明物体时，需要渲染'front to back'。这意味着更远的对象需要首先渲染，最近的对象最后。

最初 PointCloud 对象有一个 sortParticles 属性来帮助您完成这项工作，但它已被删除。

见https://github.com/mrdoob/three.js/issues/5668

Three.js 通过具有透明度的 pointCloudMaterial 纹理看不到一些对象

Three.js Some objects not seen through pointCloudMaterial texture with transparency

transparency

textures

particles

three.js