Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get the mouse clicking position on an obj file loaded from OBJLoader?

Tags:

three.js

webgl

I loaded the model using OBJLoader, here is the code for loading the obj file:

        var loader = new THREE.OBJLoader();
        loader.load('obj/teeth/teeth4_5.obj', function(object) {
            model = object;
            scene.add( model );
            objects.push( model );
        });

And I'm trying to use raycaster to find the intersection. I implemented my code from the canvas_interactive_cubes example (http://mrdoob.github.io/three.js/examples/canvas_interactive_cubes.html) in three.js. Here is the code to find the intersection:

    function onDocumentMouseDown( event ){
        event.preventDefault();
        var mouseX = (event.clientX / window.innerWidth)*2-1;
        var mouseY = -(event.clientY /window.innerHeight)*2+1;
        var vector = new THREE.Vector3( mouseX, mouseY, 0.5 );
        projector.unprojectVector( vector, camera );
        var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
        var intersects = raycaster.intersectObjects( scene.children );
        console.log( intersects[0].point);
    }

Unfortunately I'm not able to get the x,y,z coordinates of the intersection, no matter where I clicked, it always showed "TypeError: intersects[0] is undefined".

I'm getting stuck here for several days. Can someone tell me a way to get the intersection on a loaded obj file? I appreciate your help.

like image 952
user2309002 Avatar asked Apr 23 '13 03:04

user2309002


1 Answers

Try adding the recursive flag like so:

var intersects = raycaster.intersectObjects( objects, true );

three.js r.58

like image 167
WestLangley Avatar answered Nov 02 '22 15:11

WestLangley