tre js vertici non aggiornati

Question

Sto usando three.js r67 e i vertici non sembrano essere aggiornati. Ho impostato geometry.dynamic = true, geometry.verticesNeedUpdate = true. Il cerchio si muove, ma la linea è statica ....

Qualcuno potrebbe aiutarmi?

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(); 

Answer 1

Se si desidera modificare i vertici della geometria, è necessario impostare geometry.verticesNeedUpdate = true;.

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

Dopo il rendering, geometry.verticesNeedUpdate è ripristinata alle false, quindi è necessario ripristinare al true ogni volta che i vertici della geometria sono cambiati.

EDIT: Se si utilizza BufferGeometry, utilizzare questo modello invece:

geometry.attributes.position.needsUpdate = true; 

Three.js r.74