[英]Three.js Raycaster not detecting scene mesh
我在Chrome版本35.0.1916.153 m中使用three.js r67
我试图与我在场景中创建的一些自定义网格相交。 尽管它们存在于scene.children中,但射线广播程序似乎并未注册该网格。
网格创建代码:
if (modelVertices != null && modelVertices.length >= 3) {
triangles = THREE.Shape.Utils.triangulateShape ( modelVertices, holes );
for( var i = 0; i < triangles.length; i++ ){
modelGeometry.faces.push( new THREE.Face3( triangles[i][0], triangles[i][2], triangles[i][2] ));
}
modelGeometry.computeFaceNormals();
var modelMesh = new THREE.Mesh(modelGeometry, material);
modelMesh.material.side = THREE.DoubleSide;
polyhedralzGroup.add(modelMesh)
}
射线广播代码:
var projector = new THREE.Projector();
projector.unprojectVector( vector, camera );
var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
//console.log("Work");
// See if the ray from the camera into the world hits one of our meshes
var intersects = raycaster.intersectObjects( scene.children, true );
helper.position.set( 0, 0, 0 );
//console.log(intersects.length);
if ( intersects.length > 0 ) {
if (intersects[ 0 ].face != null) {
helper.lookAt( intersects[ 0 ].face.normal );
helper.position.copy( intersects[ 0 ].point );
}
如代码中一样,我正在使用computeFaceNormals(); 所以这不是问题(请参阅此处 )。 奇怪的是,场景似乎与我使用简单三角形构造的其他几何形状相交 (即不使用THREE.Shape.Utils.triangulateShape;只是手动推动三角形顶点和面),这完全意味着没有考虑到这一点相交的画布偏移量。 我已经检查了这两种几何形状,并且两者之间似乎没有任何根本区别。
是否有人对问题可能有什么想法?
问题与顶点的构造方式有关:使用字符串。 尽管three.js允许您构造顶点(以及几何图形和网格),并依次使用字符串显示几何图形,但它不允许您使用这些顶点进行光线投射。 更简洁地说,问题可以简化为:
改变这个:
aVertex = new THREE.Vector3( part[0], part[1] , part[2] );
对此:
aVertex = new THREE.Vector3( parseFloat(part[0]), parseFloat(part[1]) , parseFloat(part[2]) );
我不确定这是错误还是功能,因为使用字符串格式的顶点时似乎不会引发任何错误,尽管您无法对具有字符串顶点几何形状的对象进行光线投射(可能是因为法线无法计算?)。
您的问题是您将scene.children传递给了射线发生器。
var intersects = raycaster.intersectObjects( scene.children, true );
解决方案1.将模型加载到对象中
var objects = [];
objects.push(mesh);
接着
var intersects = raycaster.intersectObjects( objects, true );
解决方案1。
在第二个场景中传递您的对象,并将其传递给您的光线投射器
var scene_2
scene_2 = new THREE.Scene();
scene.add(scene_2);
scene_2.add(mesh);
var intersects = raycaster.intersectObjects( scene_2, true );
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.