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 }

小提琴：http://jsfiddle.net/y6yS4/4/

另见related answer。

three.js r.65

事件上的鼠标指针位置不在THREE.js上的箭头尖端的中心

1 个答案: