Raycaster объект не определен при наведении мыши на три. js - PullRequest
1 голос
/ 15 апреля 2020

Итак, у меня есть raycaster, настроенный с помощью мышки, чтобы изменить курсор. Это прекрасно работает! Однако он работает только так, как задумано, когда мышь находится над моделью или над самим блоком, если вы наводите курсор в пустое пространство, где нет ничего, что бы она ломалась, и возникает неопределенная ошибка ... Так что, если я наведите курсор мыши на блок, который меняет наведите курсор на указатель и затем двигайтесь от него, но затем мышь наводит указатель мыши на модель за полем, это работает, и курсор переключается на автоматический режим, но если после наведения курсора на поле, в котором ничего нет, курсор все равно остается указателем вместо изменения на auto

function onDocumentMouseMove(event) {

    event.preventDefault();
    var mouse = new THREE.Vector2();
    mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
    mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;

    raycaster.setFromCamera(mouse, camera);

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


    if (intersects[0].object.name == 'MaBox') {
        container.style.cursor = 'pointer';
        console.log('Mouse is over')
    } else {

        container.style.cursor = 'auto';
        console.log('Mouse is off')
    }
}

Ошибка:

Uncaught TypeError: Невозможно прочитать свойство 'объект' из неопределенного в HTMLDocument.onDocumentMouseMove

Any предложения?

1 Ответ

2 голосов
/ 16 апреля 2020

Вам необходимо убедиться, что массив intersects не пустой. В противном случае нет элемента индекса 0.

Примерно так:

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

    if (intersects.length > 0) { // check the array

        if (intersects[0].object.name == 'MaBox') {
            container.style.cursor = 'pointer';
            console.log('Mouse is over')
        } else {

            container.style.cursor = 'auto';
            console.log('Mouse is off')
        }
    }
...