javascript - convert mouse click to 3d space with orthographic camera -


three.js : rev 73

i'm using following construct find intersection of mouse click objects in 3d world (orthographic setup):

function ondocumentmousedown(event) {    event.preventdefault();    console.log("click");      var mouse = new three.vector2();    mouse.x = (event.clientx / window.innerwidth) * 2 - 1;    mouse.y = -(event.clienty / window.innerheight) * 2 + 1;      var raycaster = new three.raycaster();    // update picking ray camera , mouse position	    raycaster.setfromcamera(mouse, camera);      // calculate objects intersecting picking ray    var intersects = raycaster.intersectobjects(scene.children);      console.log("intersects: " + intersects.length);      (var = 0; < intersects.length; i++) {      console.log(intersects[i].point);    }    }

however, intersection inaccurate. intersection captured when click near top left of box only.

jsfiddle: can please me understand why misbehaving ?

also, if no object being selected, want find out click in 3d world relative box - left, right, below box ? can use ray compute ?

you have accurate mouse position ray-casting :-

  mouse.x = ( (event.clientx -renderer.domelement.offsetleft) / renderer.domelement.width ) * 2 - 1;    mouse.y = -( (event.clienty - renderer.domelement.offsettop) / renderer.domelement.height ) * 2 + 1; 

you have fire event listener when window resize update fiddle again check . add new function window resize... code self explaintory ...hope got .

check update fiddle

updated fiddle :- http://jsfiddle.net/gc1v0rza/5/


Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

javascript - Get parameter of GET request -

javascript - Twitter Bootstrap - how to add some more margin between tooltip popup and element -