This question may have been asked before and answered, but despite following several suggestions (such as the one found here Mouse / Canvas X, Y to Three.js World X, Y, Z), I am still facing difficulties with my current situation.
I have successfully implemented object selection in my code using the following:
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);
}
}
While the above code works as intended, I also require the precise world coordinates of my current mouse position. I am uncertain if the solutions I have attempted are suitable for the orthographic camera that I am utilizing. When I log either scope.mouse.x
or vector.x
, I do not obtain the world coordinates. Although ray
successfully identifies the objects, I am unsure how to retrieve the current coordinates of the ray in the world.