2016-03-08 1 views
1

J'utilise three.js. Et la ligne n'est pas mise à jour. Je veux allonger cette ligne en temps réel.lignes trois.js ne met pas à jour

  • Je pense, d'abord, qu'une ligne est dessinée en lisant les deux données.
  • Deuxièmement, Scène et effacer. Troisièmement, lire la troisième information et la ligne étendue.
  • Quatrièmement, Scène et effacer.
  • Enfin, la ligne est plus longue en temps réel.

Mais, cette ligne n'est pas générée.

var geometry = new THREE.Geometry(); 
var material = new THREE.LineBasicMaterial ({color : 0x0100FF, linewidth : 6}); 
function line_(k){ 
      if(k-1 >= 0){ 
       geometry.vertices.push (new THREE.Vector3 (py[k]*API.Orbit_Scale ,pz[k]*API.Orbit_Scale ,px[k]*API.Orbit_Scale)); 
      } 
      else{ 
       geometry.vertices.push (new THREE.Vector3 (0,0,0)); 
      } 
      line = new THREE.Line (geometry, material); 
      line.geometry.verticesNeedUpdate = true; 
      scene.add (line); 
     } 

function animate(){ 
      onWindowResize(); 
      line.geometry.verticesNeedUpdate = true; 
      renderer.render(scene, camera); 
      scene.remove(line); 
      requestAnimationFrame(animate); 
     } 

Répondre

1

Avec une instance THREE.Geometry vous pouvez mettre à jour la position des sommets existants dans le tableau et utiliser verticesNeedUpdate pour animer une ligne. Vous ne pouvez pas ajouter les sommets à une ligne existante et attendre verticesNeedUpdate pour dessiner votre nouvelle ligne avec les sommets ajoutés.

La solution la plus simple pour ajouter des sommets à une géométrie de ligne existante est:

  • enlever la vieille ligne de la scène
  • Créer une nouvelle ligne avec des sommets supplémentaires
  • ligne Ajouter à la scène

Vous pouvez également lier ceci à une boucle d'animation.


Si vous souhaitez animer sans retirer/ajouter la géométrie, vous devez utiliser une utilisation avec une instance THREE.BufferGeometrydrawCalls à la place. Comment faire que vous pouvez lire here in this answer