如何在three.js中从BufferGeometry绘制二维/三维网格

我通过prisoner849的评论发现了这一点——文档中没有明确提到这一点,示例中也隐藏了这一点,但这正是 index 属性为。什么时候? LineSegments GeometryBuffer 具有此属性的行基于索引对,而不是 position 财产。

let nn = n * n;
let nnn = n * n * n;

function mapTo3D(index) {
    let x = index % n;
    let y = Math.floor(index / n) % n;
    let z = Math.floor(index / nn);
    return { x: x, y: y, z: z };
}

function mapFrom3D(x, y, z) {
    return x + y * n + z * nn;
}

// add nnn points to the position attribute of your myGeometryBuffer...

let indices3D = [];
for (let i = 0; i < nnn; i++) {
    var p = mapTo3D(i);
    if (p.x + 1 < n) {
        indices3D.push(i);
        indices3D.push(mapFrom3D(p.x + 1, p.y, p.z));
    }
    if (p.y + 1 < n) {
        indices3D.push(i);
        indices3D.push(mapFrom3D(p.x, p.y + 1, p.z));
    }
    if (p.z + 1 < n) {
        indices3D.push(i);
        indices3D.push(mapFrom3D(p.x, p.y, p.z + 1));
    }
}

myBufferGeometry.setIndex(indices3D);
let lines = new THREE.LineSegments(myBufferGeometry);