javascript - ThreeJS PointMaterial纹理透明背景问题

Question

我有一组用 THREE.Points 制作的粒子，我正在使用带纹理的 THREE.PointMaterial。纹理是用 Canvas 制作的笔划矩形，它可以工作，但只是部分工作，这就是问题所在。

在这里你可以看到我的粒子发生了什么:

如您所见，粒子的透明度仅适用于某些粒子，而某些粒子则不然。

这里会发生什么？

这是我用来创建 Material 的代码:

var material = new THREE.PointsMaterial( {
  size: this.particleSize,
  vertexColors: THREE.VertexColors,
  map: ct.getTexture(),
  transparent: true,
  fog: false } );

Answer 1

你的问题的原因是粒子没有按深度排序并以从后到前的顺序呈现。

解决方法是添加

material.alphaTest = 0.5;

然后，透明片段将被丢弃。

three.js r.73