javascript - 如何捕获组中特定网格上的点击事件

Question

我有一组圆形几何元素，它们位于二十面体元素的顶点上。我想使用 jQuery 在每个单独的圆形元素上执行单击事件。那么如何在这些元素上实现 jQuery 点击事件..

给我推荐一些好的引用资料..

Answer 1

使用光线转换方法。基 native 制是这样的: (三个修订版 70 和 javascript vanila)

1) 设置目标

var targets = [], 
    // When defining your 3d objects, use the push method 
    // to select the meshes you want to intersect.
    // targets.push(objectMesh);

2) 设置光线转换器

var raycaster = new THREE.Raycaster(),
    mouse = new THREE.Vector2(),
    intersects;

3) 与目标相交

searchTarget(event){
    mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
    mouse.y = - (event.clientY / window.innerHeight) * 2 + 1;
    raycaster.setFromCamera(mouse, camera);
    intersects = raycaster.intersectObjects(targets);
    if (intersects.length > 0){
         // Use the intersected objects: 
         // intersects[0] represents the foremost object that was hovered
    }
}

4) 设置监听器

renderer.domElement.addEventListener('mousemove', searchTarget, false);

您还可以使用 jQuery:$( "#canvas").mousemove( searchTarget );