three.js - 创建正确旋转的 ArrowHelper

Question

如何在 Three.js (r58) 中创建正确旋转的 ArrowHelper？

var point1 = new THREE.Vector3(0, 0, 0);
var point2 = new THREE.Vector3(10, 10, 10);
var direction = new THREE.Vector3().subVectors(point1, point2);
var arrow = new THREE.ArrowHelper(direction.normalize(), point1);
console.log(arrow.rotation);

我总是以Object {x: 0, y: 0, z: 0}箭头旋转结束。我究竟做错了什么？

Answer 1

ArrowHelper使用四元数来指定它的方向。

如果你这样做：

var rotation = new THREE.Euler().setFromQuaternion( arrow.quaternion );

您将看到以欧拉角表示的等效方向，尽管在 r.59 中，arrow.rotation现在已自动更新，因此您将不再看到零。

编辑：答案更新为 three.js r.59