Three.js 拾取无法与自定义几何图形一起正常工作

Question

我在选择实施时遇到了问题。我发现了许多不同的例子做我想做的事，但我真的不能让它按应有的方式工作。我主要关注this example

基本上，我的场景中有一些网格，双击其中任何一个，我想更改所选网格的颜色。在场景中，有 3 个小立方体始终被选中，而一些更复杂的网格通常不被选中。我想知道是否有人可以帮助我弄清楚为什么如果可以选择多维数据集，其他人通常不能。

我用来检测点击网格的代码是：

var projector = new THREE.Projector();

var vector = new THREE.Vector3( ( event.clientX / window.innerWidth ) * 2 - 1, - ( event.clientY / window.innerHeight ) * 2 + 1, 0.5 );

projector.unprojectVector( vector, camera );

var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() );

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

if ( intersects.length > 0 ) 
{
    intersects[ 0 ].object.material.color.setHex( Math.random() * 0xffffff );
}

Answer 1

ray.intersectObject()，由ray.intersectObjects()调用，需要人脸质心。

mesh.geometry.computeCentroids();

如果您要创建自己的自定义几何图形，这一点很重要。

three.js r.51

从 r54 起不再需要。参见 WestLangley 的评论