Question

老实说，我试图在下面找到问题的解决方案，请帮助我。抱歉我的英语：）

我创建了一张地图，添加了一个摄像头+添加了所有尺寸的摄像头控件。

当我得到光标相对于网格的位置时，位置总是不同的角度。

查看jsfiddle.net中的所有代码：http://jsfiddle.net/BT3g3/

我使用Three.js r49。

此代码负责计算位置。

function onDocumentMouseMove(event) {
    var vector = new THREE.Vector3(  ( event.clientX / window.innerWidth ) * 2 - 1, - ( event.clientY / window.innerHeight ) * 2 + 1, 1);
    projector.unprojectVector( vector, camera );

    var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() );
    var intersect = ray.intersectObject( island );  

    if ( intersect.length > 0) { // !!
        document.getElementById('z').value = intersect[0].point.z;
        document.getElementById('x').value = intersect[0].point.x;
    }
}

我正在浏览互联网并遇到an article，其中光标位置被捕获在地图上，但我无法将此方法移动到我的项目中:(

请帮忙！

Answer 1

您是否尝试过以下操作？

mouseX = ( ( event.clientX - canvas.offsetLeft ) / canvas.clientWidth ) * 2 - 1;
mouseY = - ( ( event.clientY - canvas.offsetTop ) / canvas.clientHeight ) * 2 + 1;

webgl three.js在Mesh上获得鼠标位置

1 个答案: