Three.js - arrowHelper를 업데이트하려면 어떻게해야합니까?

Question

arrowHelper를 업데이트하려고합니다. 화살표 객체의 선에서 꼭지점을 조작 해 보았습니다. 모든 항목을 dynamic = true 등으로 설정했지만, 할 수있는 유일한 방법은 이전 선을 제거하고 새 선을 그리는 것입니다. arrowHelper를 업데이트 할 수있는 방법이 있습니까?

Answer 1

따라서 개체를 만들 때 사용한 값을 변경하여 무언가를 업데이트하는 일반적인 방법으로 화살표 헬퍼를 업데이트 할 수 없습니다.

그러나 화살표 위치를 움직여서 겉보기 시작 지점을 움직일 수 있으며, 새 방향과 길이를 지정하여 명확한 종점을 이동할 수 있습니다. 여기

그것을 할 방법은 다음과 같습니다

// new arrowHelper 
var sourcePos = new THREE.Vector3(0, 0, 0); 
var targetPos = new THREE.Vector3(0, 50, 0); 
var direction = new THREE.Vector3().sub(targetPos, sourcePos); 
var arrow = new THREE.ArrowHelper(direction.clone().normalize(), sourcePos, direction.length(), 0x00ff00); 
scene.add(arrow); 

// update the arrow 
var newSourcePos = new THREE.Vector3(10, 10, 10); 
var newTargetPos = new THREE.Vector3(60, 10, 10); 
arrow.position.set(newSourcePos); 
direction = new THREE.Vector3().sub(newTargetPos, newSourcePos); 
arrow.setDirection(direction.normalize()); 
arrow.setLength(direction.length());