three.js 鼠标点击获取模型对象

three.js 创建模型后，想要实现点击模型获取模型对象触发相应事件。可以使用它提供的API THREE.Raycaster()
https://threejs.org/docs/index.html?q=Raycaster#api/en/core/Raycaster

 
//监听点击事件
window.addEventListener('click', (event) => {

    event.preventDefault();

    var raycaster = new THREE.Raycaster();

    var mouse = new THREE.Vector2();

    mouse.x = ((event.clientX) / renderer.domElement.clientWidth) * 2 - 1;

    mouse.y = -((event.clientY) / renderer.domElement.clientHeight) * 2 + 1;

    raycaster.setFromCamera(mouse, camera);

    var intersects = raycaster.intersectObjects(scene.children, true);

      //当intersects.length > 0说明碰点击到物体（可能为多个重合的物体），获取最近的物体名称进行判断

    if (intersects.length > 0) {
        console.log(intersects)
    }

});