Question

我在three.js中的Obj上有mouseover mouseout事件的问题。我实际上可以单击它并双击它，但是当我进行鼠标悬停时，什么也没有发生，也没有控制台错误，有人可以告诉我如何对用OBJ.loader导入的obj进行鼠标悬停事件吗？

我使用基本的网格物体进行了尝试，并且效果很好

   var scene = new THREE.Scene();
   //scene.background = new THREE.Color(0xa8811f, 0.2);
   var camera = new THREE.PerspectiveCamera(75, window.innerWidth /               window.innerHeight, 0.1, 1000);

var renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });
renderer.setSize(window.innerWidth, window.innerHeight - 20);
renderer.setClearColor(0x00000, 0);
document.body.appendChild(renderer.domElement);



camera.position.z = 400;

var controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.enableDamping = true;
controls.campingFactor = 0.25;
controls.enableZoom = true;
controls.noPan = true;




var keyLight = new THREE.DirectionalLight(new THREE.Color('hsl(250, 50%, 75%)'), 1.0);
keyLight.position.set(-100, 0, 100);

var fillLight = new THREE.DirectionalLight(new THREE.Color('hsl(240, 100%, 75%)'), 0.75);
fillLight.position.set(100, 0, 100);

var backLight = new THREE.DirectionalLight(0xffffff, 1.0);
backLight.position.set(100, 0, -100).normalize();

scene.add(keyLight);
scene.add(fillLight);
scene.add(backLight);

var mtlLoader = new THREE.MTLLoader();
mtlLoader.setTexturePath('../assets/');
mtlLoader.setPath('../assets/');
mtlLoader.load('hand_02.mtl', function (materials) {

    materials.preload();

    var objLoader = new THREE.OBJLoader();
    objLoader.setMaterials(materials);
    objLoader.setPath('../assets/');
    objLoader.load('hand_02.obj', function (object) {
        object.rotation.y = 4.8;
        object.position.x -= 0;
        object.position.y -= 240;
        scene.add(object);
        myModel = object;

        const domEvents = new THREEx.DomEvents(camera, renderer.domElement)

        domEvents.addEventListener(myModel, 'click', event => {
            console.log("kikoo");
        })

    });
});






var animate = function () {
    requestAnimationFrame(animate);

    myModel.rotation.y += 0.01;
    controls.update();

    renderer.render(scene, camera);
};
animate();

我希望可以通过mouseOver和将鼠标移出obj进行回调

将鼠标悬停在dom事件上无法与Obj loader一起使用

0 个答案: