Raytracing with threejs

Question

I am using OrthographicCamera and a simple PlaneBufferGeometry( 300, 500 ) that gets rotated. I am using the code below but regardless of where I mouse click, it never intersects. I have tried everything I can think of but still cannot get it to work.

Here is my code:

var vector = new THREE.Vector3( );
var raycaster = new THREE.Raycaster();
var dir = new THREE.Vector3();
vector.set( ( event.clientX / $(container).width() ) * 2 - 1, - ( event.clientY / $(container).height() ) * 2 + 1, - 1 ); // z = - 1 important!
vector.unproject( camera );
dir.set( 0, 0, - 1 ).transformDirection( camera.matrixWorld );
raycaster.set( vector, dir );
var intersects = raycaster.intersectObjects( objects, true );

Any suggestions would be greatly appreciated

Shahar Nacht Shahar Nacht · Accepted Answer · 2015-08-08T20:00:39

There seems to be a much simpler way to do this:

mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
raycaster.setFromCamera( mouse, camera );
var intersects = raycaster.intersectObjects( objects );

If you have any more problems with this, here is a working example: http://threejs.org/examples/#webgl_interactive_cubes

I hope i could help! =)

Raytracing with threejs

1 Answers