如何使用PointerLockControls在Three.js中对鼠标进行命中检测？

Question

我做了一个开源项目。它是使用Three.js以3D形式显示书籍的数据可视化工具。 （https://github.com/AlinCiocan/BooksIn3D）。现在，如果按下一个键，我想检测用户是否在书前。像这样：

例如，在上图中，光标指针没有击中任何书籍。

我尽力使功能发挥作用，但我陷入困境。我搜索了有关如何使用PointerLockControls进行命中检测的问题，但我什么都没找到。我必须说我的光标手不动，它总是在屏幕的中心。

function hitDetection(targets, callback) {
    var projector = new THREE.Projector();
    var raycaster = new THREE.Raycaster();

    var mouse = {};
    // it is always the center of the screen
    mouse.x = 0;
    mouse.y = 0;

    var vector = new THREE.Vector3(mouse.x, mouse.y, 1);
    var cameraDirection = controls.getDirection(vector).clone();
    projector.unprojectVector(cameraDirection,camera );

    var ray = new THREE.Raycaster(controls.getObject().position, cameraDirection.sub(controls.getObject().position).normalize());

    var intersects = ray.intersectObjects(targets);

    // if there is one (or more) intersections
    if (intersects.length > 0) {

        var hitObject = intersects[0].object;
        console.log("hit object: ", hitObject);
        callback(hitObject);

    }
}