javascript - 事件上的鼠标指针位置不以 THREE.js 上的箭头提示为中心

Question

当使用带有正交相机的 THREE.js 时，我试图确定屏幕上点击事件的位置。

但是，该位置(以与完成 here 类似的方式确定)不准确。它位于鼠标指针区域但不完全位于尖端。

通过查看在线示例，我可以看到对于透视相机，这是正确的。

这种行为是正确的还是我的代码有问题？有没有办法将确定的位置与箭头尖端对齐？

function onDocumentMouseDown(event) {
    event.preventDefault();
    var vector = new THREE.Vector3((event.clientX / window.innerWidth) * 2 - 1, -(event.clientY / window.innerHeight) * 2 + 1);
    projector = new THREE.Projector();
    var ray = projector.pickingRay(vector, camera);
    pointer.position = vector.clone();
    pointer.position.z = 0;

    renderer.render(scene, camera);
}

您可以看到一个工作示例 here

Answer 1

你需要一点 CSS:

body { margin: 0 }

fiddle :http://jsfiddle.net/y6yS4/4/

另见 related answer .

three.js r.65