与此问题相关:Z-buffer issue with BufferGeometry in ParticleSystem
给定的解决方案对我不起作用,我创建了自己的着色器进行渲染,因为我添加了大小和UV的自定义属性。除了透明度的粒子排序外,Everythinf与缓冲区几何体一起工作正常。
如果已激活>平方纹理部分隐藏了其他粒子。
如果已停用(depthTest:false)>颗粒看起来很好,但没有订购。
感谢您的回答,该主题已多次提出,但对我来说没有任何效果。
使用Three.js 61
particleMaterial = new THREE.ShaderMaterial({
fragmentShader : document.getElementById("sectorPointFragment").textContent,
vertexShader : document.getElementById("sectorPointVertex").textContent,
uniforms : uniforms,
attributes : attributes,
transparent : true,
alphaTest : 0.5
});
_this.particles = new THREE.ParticleSystem(geometry, particleMaterial);
_this.particles.sortParticles = true;
答案 0 :(得分:0)
所以这是我采用的解决方案,每次创建一个具有值的新数组。似乎工作,测试1000粒子不多
this.updateShaders = function() {
if(clock.getElapsedTime() - _lastZOrdering <= 0.2) {
return;
}
// z-ordering
var distances = [],
attributes = this.particles.geometry.attributes,
nbParticle = attributes.position.numItems / 3,
tmpPos = new THREE.Vector3(0, 0, 0);
for (var i = 0; i < nbParticle; ++i) {
tmpPos.set(
attributes.position.array[i * 3],
attributes.position.array[i * 3 + 1],
attributes.position.array[i * 3 + 2]
);
distances[i] = [this.controls.object.position.distanceTo(tmpPos), i];
}
distances.sort(function(a, b){
return b[0] - a[0];
});
var index, indexSrc, indexDst, tmpTab;
for (var val in attributes) {
tmpTab = new Float32Array(attributes[val].itemSize * nbParticle);
for(i = 0; i < nbParticle; ++i){
index = distances[i][1];
for(j = 0; j < attributes[val].itemSize; ++j){
indexSrc = index * attributes[val].itemSize + j;
indexDst = i * attributes[val].itemSize + j;
tmpTab[indexDst] = attributes[val].array[indexSrc];
}
}
attributes[val].array = tmpTab;
attributes[val].needsUpdate = true;
}
_lastZOrdering = clock.getElapsedTime();
}