我有一个粒子云,我用缓冲区几何学制作了三个粒子云,我通过THREE.LineSegments将这些粒子与一个THREE.LineBasicMaterial连接起来:

正如你所看到的,有些线条是黑色或灰色的--我想让它变成透明的白色阴影。
我相信这是有关的代码行:
var material = new THREE.LineBasicMaterial({
vertexColors: THREE.VertexColors,
blending: THREE.AdditiveBlending,
color: 0xffffff,
transparent: true,
});
var colors = new Float32Array(segments * 3);
geometry.addAttribute(
"color",
new THREE.BufferAttribute(colors, 3).setDynamic(true)
); //will allow us to set the color of the lines between particles in buffer geometry
linesMesh = new THREE.LineSegments(geometry, material);
...
animate(){
for (var i = 0; i < particleCount; i++) { //loop through particles to make line connections
for (var j = i + 1; j < particleCount; j++) { //check collision
var dist = Math.sqrt(dx * dx + dy * dy + dz * dz); //getting particle positions to neighbors
if (dist < effectController.minDistance) { //make a connection
var alpha = 1.0 - dist / effectController.minDistance;
colors[colorpos++] = alpha;
}
}
}
}发布于 2020-07-15 17:57:59
简单答案
默认的three.js着色器将顶点颜色实现为vec3 (RGB),因此没有透明组件。
搜索USE_COLOR in https://github.com/mrdoob/three.js/blob/r118/src/renderers/webgl/WebGLProgram.js (r118)以查看此定义。
高级答案
您可以编写自己的着色器,将颜色属性作为vec4来接受,为每种颜色添加一个透明组件。您需要进一步了解线型材料是如何使用颜色的,以及它是如何沿着一条线混合顶点颜色的。或者,因为它是你的着色器,让它做你想要的混合。
https://stackoverflow.com/questions/62920456
复制相似问题