Javascript 重用修改后的Three.js几何体

我正在使用Three.js显示随机行走后粒子的线条。由于几何体无法动态放大，我将从场景中删除线条，更改几何体并向场景中添加新线。以下是相关代码：

var step = .5;

var material = new THREE.LineBasicMaterial({ color: 0x0077ff }); 
var geometry = new THREE.Geometry();
geometry.vertices.push( new THREE.Vector3(0,0,0) );
scene.add( new THREE.Line( geometry, material ) );

var render = function () {
  requestAnimationFrame( render ); 
  renderer.render(scene, camera);
  controls.update();
}

function addStep() {
  scene.remove( scene.children[1] );
  last = geometry.vertices[ geometry.vertices.length - 1 ];
  geometry.vertices.push( new THREE.Vector3( last.x + (2*Math.random()-1)*step,
        last.y + (2*Math.random()-1)*step, last.z + (2*Math.random()-1)*step ));
  scene.add( new THREE.Line( geometry.clone(), material ) );
}

setInterval( addStep, 500);
render();

此代码有效，但仅当在每个步骤克隆几何体时有效。如果

addStep（）

的最后一行更改为

  scene.add( new THREE.Line( geometry, material ) );

然后，在渲染开始添加线段之前，可以根据需要多次调用它，但如果在渲染开始之后调用，则不会显示任何内容

---

大概我遗漏了一些关于图形缓冲区或变量分配的简单内容，但如果有人能解释一下为什么修改后的几何体不能在不进行克隆的情况下重用，我将不胜感激。

@PaulMasson这里是一个JSFIDLE，它对您的代码进行了修改：

唯一真正的区别是该代码段使用了

new THREE.Geometry（）

而不是clone

---

我猜Three.js几何体与其在缓冲区几何体中的表示形式紧密相关。因此，编辑几何体的唯一方法是克隆几何体或新建几何体。

有关一些提示，请参阅。应该没有理由从场景中删除几何体。@WestLangley我知道我可以用给定数量的点构造一条线，然后逐个显示，但这意味着固定数量的步骤。对于一个开放的数字，我需要重新创建线，问题是为什么几何体不能在不克隆的情况下重复使用。

function addStep() {

    vertices = geometry.vertices;
    last = vertices[ vertices.length - 1 ];
    vertices.push( 

        new THREE.Vector3( 
        last.x + ( 2 * Math.random() - 1 ) * step,
        last.y + ( 2 * Math.random() - 1 ) * step, 
        last.z + ( 2 * Math.random() - 1 ) * step ) 

    );

    geometry = new THREE.Geometry();
    geometry.vertices = vertices;

    scene.remove( line );
    line = new THREE.Line( geometry, material )
    scene.add( line );

}