Question

使用Three.js时遇到了与顶点颜色相关的问题。我创建了BufferGeometry，它由2个三角形组成的正方形组成。

var geometry = new THREE.BufferGeometry();
// filling positions and colors
geometry.addAttribute('position', new THREE.BufferAttribute(positions, 3));
geometry.addAttribute('color', new THREE.BufferAttribute(colors, 3));

var material = new THREE.MeshPhongMaterial(
    {
        side: THREE.OneSide, vertexColors: THREE.VertexColors
    });
GridFloor = new THREE.Mesh(geometry, material);
GridFloor.rotation.x = Math.PI / 2;
GridFloor.geometry.dynamic = true;
GridFloor.geometry.__dirtyColors = true;
scene.add(GridFloor);

一切正常，直到我改变顶点颜色。我正在改变它们，试图更新，但没有任何反应......

var newColor = new THREE.Color(0xff0000);
var colors = GridFloor.geometry.attributes.color.array;
    for (var i = 0, j = 0; i < 4; i++, j += 3) {

        var index = INTERSECTED.indices[i % 3] * 3;

        colors[index] = newColor.r;
        colors[index + 1] = newColor.g;
        colors[index + 2] = newColor.b;
    }
GridFloor.geometry.colorsNeedUpdate = true;

INTERSECTED.colorsNeedUpdate = true;

感谢您的帮助。

Answer 1

以下是为needsUpdate设置BufferGeometry标记的方法。

bufferGeometry.attributes.attributeName.needsUpdate = true;

three.js r.68

BufferGeometry：顶点颜色已更改，但未在视觉上更新

1 个答案: