希望在网页上显示的 .obj 文件上有单击事件

Want to have click event on the .obj file shown on the webpage

本文关键字：文件 单击 事件 obj 网页 显示 希望      更新时间：2023-09-26

我在网页上有一个使用Three js的.obj文件。我的目标是，当我向左/向右拖动鼠标时，OBJ 模型应该旋转，我可以使用三个来做到这一点。轨迹球控件（）。接下来，我想谈谈该 OBJ 模型上的特定点，如果鼠标按下这些点，就会发生一些事情（例如将在网页上显示的计数器增加）。我已经看过三个 js 的 DOMevents，但看起来它允许我们单击整个对象而不是对象上的特定点。我怎样才能做到这一点？

你必须创建一个光线投射器。（R69）

mouse_vector = new THREE.Vector3(),
mouse = { x: 0, y: 0, z: 1 };
var vector = new THREE.Vector3();
var raycaster = new THREE.Raycaster();
var dir = new THREE.Vector3();
function onMouseDown( event_info ) 
{
    event_info.preventDefault();  
    mouse.x = ( event_info.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( event_info.clientY / window.innerHeight ) * 2 + 1;
    mouse_vector.set( mouse.x, mouse.y, mouse.z );
    mouse_vector.unproject(camera);
    var direction = mouse_vector.sub( camera.position ).normalize();
    ray = new THREE.Raycaster( camera.position, direction );
    ray.set( camera.position, direction );
    intersects = ray.intersectObjects(scene.children, true);
    if( intersects.length ) 
    {
        intersects.forEach(function(clicked) 
        {
            // Your stuff like
            if (clicked.object.typ == 'yourObject')
            {
                //Event on click..  
            } 
        });
    }
}
相关文章：