Question

我有一个散点图，其中几个随机Sprite个对象被用作数据点。我想检测鼠标指针（光标）和Sprite对象之间的交叉点。我用来检测交叉点的设置如下：

var projector = new THREE.Projector();

window.addEventListener('mousedown', function (ev) {
    if (ev.target == renderer.domElement) {
        var vector = new THREE.Vector3((ev.clientX / window.innerWidth) * 2 - 1, -(ev.clientY / window.innerHeight) * 2 + 1, 0.5);
        var projector = new THREE.Projector();
        projector.unprojectVector(vector, camera);

        var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());

        var intersects = raycaster.intersectObjects(particles);
        console.log(intersects[0]);
    }
}, false);

我遇到的问题是，当我从远处单击Sprite对象时（即，单击数据点而未在图上放大），raycaster.intersectObjects(particles)似乎没有返回任何内容。换句话说，intersects的长度为0.期望的行为是当单击数据点（即，光标下出现数据点）时，raycaster.intersectObjects()返回光标下的对象。

到目前为止，我已经创造了一个小提琴：http://jsfiddle.net/jmg157/ynFzw/

非常感谢，一如既往！

Answer 1

使用Raycaster时，您需要确保在CSS中设置

body { margin: 0 }

或等同于某些东西，否则，检测将被抵消。

此外，Raycaster的{{1}}实施需要改进。

目前，如果光线在精灵位置的一定距离内通过，则会发生检测。检测区域是半径为Sprites的圆。不考虑精灵的形状。

three.js r.64

无法获取raycaster.intersectObjects（）以从远处返回相交的对象

1 个答案: