Почему мой расист не пересекает ничего?

Question

У меня есть этот код, предназначенный для поиска сетки пользователь щелкает на:

// scene and camera are defined outside of this code 
var mousePoint = new THREE.Vector2(); 
var raycaster = new THREE.Raycaster(); 
var intersections; 

function onClick(event) { 
    mousePoint.x = event.clientX; 
    mousePoint.y = event.clientY; 
    raycaster.setFromCamera(mousePoint, camera); 
    intersections = raycaster.intersectObjects(
    scene.children); 
} 

Но каждый раз, когда я нажимаю, intersections возвращается как пустой массив, ни с чем не получать пересекались. Что я делаю не так?

Answer 1

От the three.js documentation for Raycaster (курсив мой):

coords - 2D координаты мыши, в нормализованных координат устройства (NDC) --- компоненты X и Y должна быть в пределах от -1 и 1.
camera - камера, из которой луч должен происходить

обновления луча с новым происхождением и направлением.

Таким образом, при определении координат mousePoint, вместо установки x и y непосредственно event.clientX и event.clientY, они должны быть преобразованы в это координатное пространство:

// calculate mouse position in normalized device coordinates 
// (-1 to +1) for both components 
mousePoint.x = (event.clientX/window.innerWidth) * 2 - 1; 
mousePoint.y = (event.clientY/window.innerHeight) * -2 + 1;