Question

我尝试使用THREE.Line和THREE.LineBasicMaterial在vertexColors和THREE.VertexColors设置为shading: THREE.FlatShading的情况下，使用不同顶点的不同颜色在Three.js中绘制一条线。我希望相邻顶点的颜色之间没有插值（这样颜色只是在两个顶点之间的中点处不连续变化）。

我尝试在资料上设置LineBasicMaterial，但我现在意识到这不是{{1}}的选项：http://jsfiddle.net/214huf0a/

是否有内置（或简单）方法来防止Three.js中一行上的点之间的颜色平滑，或者我是否需要编写自己的着色器？

Answer 1

您可以使用THREE.LineSegments并设置vertexColors = THREE.VertexColors，在每个细分受众群中创建一条包含一种颜色的行。

for ( var i = 0; i < geometry.vertices.length; i+=2 ) {
    geometry.colors[ i ] = new THREE.Color( Math.random(), Math.random(), Math.random() );
    geometry.colors[ i + 1 ] = geometry.colors[ i ];
}

var material = new THREE.LineBasicMaterial( {
    color: 0xffffff,
    vertexColors: THREE.VertexColors
} );

var line = new THREE.LineSegments( geometry, material );

three.js r.85

THREE.Line中的顶点颜色

1 个答案: