1

我试图使用 three.js 绘制一个边数超过 10k 的密集图。

LinePieces 用于获得更好的性能,但我不知道如何为每个边缘(线)指定不同的颜色,因为只能使用一种“材质”来创建 Line 对象。

这是一些代码:

function drawEdges() {
    edgeGeometry = new THREE.Geometry();
    edgeMaterial = new THREE.LineBasicMaterial({ opacity: 0.1 });
        foreach source-target node pair:
            edgeGeometry.vertices.push(new THREE.Vector3(source.x, source.y));
            edgeGeometry.vertices.push(new THREE.Vector3(target.x, target.y));
    }
    var edges = new THREE.Line(edgeGeometry, edgeMaterial, THREE.LinePieces);
    scene.add(edges);
}

我的问题是:如果使用 THREE.LinePieces,是否可以使用不同的材料?任何提示表示赞赏。

提前致谢。

4

1 回答 1

2

如果你正在使用WebGLRenderer,你可以。

在您的几何图形中,您需要指定geometry.colors的数组THREE.Color(),其长度等于顶点数。

然后你像这样指定你的材料和网格:

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

var mesh = new THREE.Line( geometry, material, THREE.LinePieces );

示例: http: //mrdoob.github.com/three.js/examples/webgl_lines_colors.html

三.js r.57

于 2013-03-17T03:44:24.797 回答