三个js顶点不更新答案

【问题标题】：three js vertices does not update三个js顶点不更新
【发布时间】：2014-08-23 05:51:04
【问题描述】：

我使用的是three.js r67，顶点似乎没有更新。我设置了geometry.dynamic = true，geometry.verticesNeedUpdate = true。圆在动，而线是静止的……

有人可以帮助我吗？

var scene = new THREE.Scene();
var renderer = new THREE.WebGLRenderer();

var g = new THREE.CircleGeometry( 4, 16 );
var m = new THREE.MeshBasicMaterial({color: 0x114949});
var circle = new THREE.Mesh( g, m );

circle.position.x = 2;
circle.position.y = 2;
circle.position.z = -1;
scene.add( circle );

var material = new THREE.LineBasicMaterial({color: 0xDF4949, linewidth: 5});

var geometry = new THREE.Geometry();
geometry.vertices.push(new THREE.Vector3(0, 0, 0));
geometry.vertices.push(new THREE.Vector3(1, 1, 0));
geometry.verticesNeedUpdate = true;
geometry.dynamic = true;

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

var update = function() {
  circle.position.x += 0.01;
  line.geometry.vertices[0].x = circle.position.x;
};

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

var loop = function() {
  update();
  render();
  requestAnimationFrame(loop, renderer.canvas);
};
loop();

【问题讨论】：

标签： dynamic three.js geometry vertices

【解决方案1】：

如果你想改变几何的顶点，你需要设置geometry.verticesNeedUpdate = true;。

function update() {
    circle.position.x += 0.01;
    line.geometry.vertices[ 0 ].x = circle.position.x;
    line.geometry.verticesNeedUpdate = true;
};

渲染后，geometry.verticesNeedUpdate 被重置为false，所以每次几何顶点发生变化时都需要重置为true。

编辑：如果您使用的是BufferGeometry，请改用此模式：

geometry.attributes.position.needsUpdate = true;

three.js r.74

【讨论】：