Three.js世界座標從鼠標位置與Orthographic相機

我知道這個問題已被問及許多次，並回答，但我目前沒有任何運氣與任何我已遵循的答案（主要是這一Mouse/Canvas X, Y to Three.js World X, Y, Z）。Three.js世界座標從鼠標位置與Orthographic相機

我已經得到了對象選擇做和工作我使用的代碼如下

onMouseMove:function(event) 
{ 
    event.preventDefault(); 

    var scope  = Game.GSThree, 
     $container = $(scope.container.element), 
     width  = $container.width(), 
     height  = $container.height(), 
     vector, 
     ray, 
     intersects; 

    scope.mouse.x = (event.clientX - scope.container.padding.left)/width * 2 - 1; 
    scope.mouse.y = - (event.clientY/height) * 2 + 1; 
    scope.mouse.z = 0.5; 
    vector   = new THREE.Vector3(scope.mouse.x , scope.mouse.y , scope.mouse.z); 
    ray    = scope.projector.pickingRay(vector.clone() , scope.camera); 
    intersects  = ray.intersectObjects(scope.tiles.children); 

    if(intersects.length) 
    { 
     var hovered = intersects[0].object; 
     scope.selectObject(hovered); 
    } 
}

這工作得很好，但實際上我還需要知道我的當前鼠標位置的準確世界座標。我不知道我試過的解決方案是否適用於正交相機，這正是我所使用的。如果我登錄scope.mouse.x或vector.x這些不給世界座標，ray發現物體完美，但我不知道如何獲得當前世界上射線的座標。

來源

2014-09-21 Rohan Deshpande

我在這裏發佈了一個答案：https：//stackoverflow.com/a/48068550/882912 – KTCO 2018-01-02 22:23:56

我認爲你在找什麼是：

intersects [0] .point;

來源

2014-09-22 13:35:16 Benedikt

有趣的...這個工程，但它似乎是關閉...'32px'？這是相關的，因爲我已經建立了一個基於等軸測圖的瓷磚世界，而我的瓷磚目前是'64x64'像素。也許這與將網格置於'x：0，z：0'是否將其左上角放置在這些座標處或網格的中心位置有關？我還不太確定。非常感謝，我認爲這是正確的，所以我會接受這個答案。 – 2014-09-23 05:52:01

您可能有偏移問題。你從你的鼠標位置減去填充。你還應該/改爲（？）減去scope.container.offsetLeft。或者如果你使用JQuery，最好使用$（container）.offset（）。left。使用pageX而不是clientX也更好。 – Benedikt 2014-09-24 07:38:58

btw：您不會減去y座標中的offsetTop或padding.top。 – Benedikt 2014-09-24 07:40:39

Three.js世界座標從鼠標位置與Orthographic相機

回答

相關問題