Schwierigkeiten, einen ArrowHelper zu aktualisieren, ohne einen neuen zuzuweisen

Question

Ich versuche, die Komponenten von 3 ArrowHelper mit three.js zu aktualisieren. Im Moment kann ich die 3 ArrowHelper meiner Animation erfolgreich aktualisieren, indem ich bei jedem Aufruf meiner Zeichenfunktion neue hinzufüge.

Zum Beispiel in meiner main Funktion, beginne ich um 3 ArrowHelper wie diese Zuteilung:

// Parameters for vector 
var directionMainVectorX = new THREE.Vector3(1, 0, 0); 
var directionMainVectorY = new THREE.Vector3(0, 1, 0); 
var directionMainVectorZ = new THREE.Vector3(0, 0, 1); 

var originMainVector = new THREE.Vector3(0, 0, 0); 
var lengthVector = 20; 
var widthVector = 3; 
var headLengthVector = 1.5; 
var headWidthVector = 1.5; 
var hexVector = 0x11ff00; 

mainVectorX = new THREE.ArrowHelper(directionMainVectorX, originMainVector, lengthVector, hexVector, headLengthVector, headWidthVector); 
mainVectorY = new THREE.ArrowHelper(directionMainVectorY, originMainVector, lengthVector, hexVector, headLengthVector, headWidthVector); 
mainVectorZ = new THREE.ArrowHelper(directionMainVectorZ, originMainVector, lengthVector, hexVector, headLengthVector, headWidthVector); 

Dann wurde in die drawVector() Funktion, die ich habe:

function drawVector() { 

    // Parameters for ArrowHelper 
    var headLengthVector = 1.5; 
    var headWidthVector = 1.5; 
    var hexVector = 0x11ff00; 
    var widthVector = 3; 

    // SOLUTION : Allocating each time a new vector 
    mainVectorX = new THREE.ArrowHelper(directionMainVectorX.normalize(), originMainVector, lengthVector, hexVector, headLengthVector, headWidthVector); 
    mainVectorY = new THREE.ArrowHelper(directionMainVectorY.normalize(), originMainVector, lengthVector, hexVector, headLengthVector, headWidthVector); 
    mainVectorZ = new THREE.ArrowHelper(directionMainVectorZ.normalize(), originMainVector, lengthVector, hexVector, headLengthVector, headWidthVector); 

    // Width for mainVector 
    mainVectorX.line.material.linewidth = widthVector;  
    mainVectorY.line.material.linewidth = widthVector;  
    mainVectorZ.line.material.linewidth = widthVector;  

    // Add arrows to scene reference 
    scene.add(mainVectorX); 
    scene.add(mainVectorY); 
    scene.add(mainVectorZ);  

} 

und schließlich meine render Funktion:

function render() { 

    rotateCamera(); 

    drawVector(); 

    controls.update(); 

    renderer.render(scene, camera); 

    scene.remove(mainVectorX); 
    scene.remove(mainVectorY); 
    scene.remove(mainVectorZ); 

} 

Mit dem obigen Code funktioniert alles einwandfrei.

Mein Problem ist, dass ich die "allocating at each call of drawVector() function" nicht verwenden möchte.

Deshalb habe ich durch die Zuweisung nur einmal die 3 ArrowHelper (ich es am Anfang main Code) und aktualisieren ihre Komponenten unter Verwendung von in drawVector() Funktion, wie folgt beginnen:

function drawVector() { 

    // Parameters for ArrowHelper 
    var headLengthVector = 1.5; 
    var headWidthVector = 1.5; 
    var hexVector = 0x11ff00; 
    var widthVector = 3; 

    // Compute coordinates of 3vectors 

    // Compute directions 
    directionMainVectorX.set(1, 0, 0); 
    directionMainVectorY.set(0, 1, 0); 
    directionMainVectorZ.set(0, 0, 1);  

    // Update mainVector 

    // SOLUTION : update the parameters of vector 
    mainVectorX.position.set(originMainVector); 
    mainVectorY.position.set(originMainVector); 
    mainVectorZ.position.set(originMainVector);  

    mainVectorX.setDirection(directionMainVectorX.normalize()); 
    mainVectorY.setDirection(directionMainVectorY.normalize()); 
    mainVectorZ.setDirection(directionMainVectorZ.normalize()); 

    mainVectorX.setLength(lengthVector, headLengthVector, headWidthVector); 
    mainVectorX.setColor(hexVector) 

    mainVectorY.setLength(lengthVector, headLengthVector, headWidthVector); 
    mainVectorY.setColor(hexVector) 

    mainVectorY.setLength(lengthVector, headLengthVector, headWidthVector); 
    mainVectorY.setColor(hexVector)  

    // Add arrows to scene reference 
    scene.add(mainVectorX); 
    scene.add(mainVectorY); 
    scene.add(mainVectorZ);  
} 

habe ich diesen Verfahren auf diesem früheren Post: update ArrowHelper

aber leider nichts scheint, ich habe etwas verpasst, aber ich weiß nicht, was ...

Wenn jemand helfen könnte ich, das wäre nett.

Answer 1

Vector3.set nimmt 3 Parameter - x, y, z nicht ein anderer Vektor so sollten Sie mainVectorX.position.set(originMainVector.x,originMainVector.y,originMainVector.z); oder mainVectorX.position.copy(originMainVector);

umschreiben Ihre drawVector verwenden als

function drawVector() { 

    // Parameters for ArrowHelper 
    var headLengthVector = 1.5; 
    var headWidthVector = 1.5; 
    var hexVector = 0x11ff00; 
    var widthVector = 3; 

    if(!mainVectorX.parent){  
    // Add transported arrow to scene reference 
    scene.add(mainVectorX); 
    scene.add(mainVectorY); 
    scene.add(mainVectorZ);  
    } 
    mainVectorX.position.copy(originMainVector); 
    mainVectorY.position.copy(originMainVector);  
    mainVectorZ.position.copy(originMainVector); 

    mainVectorX.setDirection(directionMainVectorX.normalize()); 
    mainVectorY.setDirection(directionMainVectorY.normalize()); 
    mainVectorZ.setDirection(directionMainVectorZ.normalize()); 

    mainVectorX.setLength(lengthVector, headLengthVector, headWidthVector); 
    mainVectorX.setColor(hexVector); 

    mainVectorY.setLength(lengthVector, headLengthVector, headWidthVector); 
    mainVectorY.setColor(hexVector); 

    mainVectorY.setLength(lengthVector, headLengthVector, headWidthVector); 
    mainVectorY.setColor(hexVector); 
} 

(jetzt ist es updateVector :) genannt werden kann) und der Natürlich sollten Sie die

scene.remove(mainVectorX); 
scene.remove(mainVectorY); 
scene.remove(mainVectorZ); 

entfernen

von der Renderfunktion