Search code examples
selectmouseeventwebglthree.jscollada

Select Collada objects by mouse Click in Three.JS

I need to select Collada objects in Three.JS by mouse click. I know that I can select object based on their id and I saw some samples that user can interact with Geometry defined objects (here). But I need to have access to the objects in Collada format.

Solution

  • Assuming that dae_scene is a COLLADA scene returned from the ColladaLoader, here's what you can do to check for intersection:

    var toIntersect = [];
THREE.SceneUtils.traverseHierarchy(dae_scene, function (child) {
    if (child instanceof THREE.Mesh) {
        toIntersect.push(child);
    }
});

    This gets all Mesh objects inside the COLLADA scene. You can then use that array to look for ray intersections, like this:

    var ray = new THREE.Ray( camera.position,
                         vector.subSelf( camera.position ).normalize() );
var intersects = ray.intersectObjects( toIntersect );