I have a mesh with many children meshes made in blender. I load this glb scene to my ThreeJS scene. Then i scale it using scale.set(). If i use Raycaster to detect the parent mesh geometry - the intersection is detected without any problems. But if i try to detect any child mesh - no intersections at all. Visually all child meshes have correct size and position. Also it have correct face/normals direction. The problem lies in that parent mesh scaling because if i scale any child directly its started to be succesfully detected by Raycaster. It looks like when i scale the parent all its children are scaled but not for Raycaster. Raycaster still thinks the children have its original size despite its matrix and geometry were actually scaled. Even if i use raycaster.intersectObjects(scene.children, true) the children meshes are not detected despite their size and bounding volumes are correct. Ive tried to use Vertex Normals Helper and Arrow helper - everything is correct. The children meshes have correct normals directions and my ray is going through the geometry but no intersections detected.
Moreover if i scale a parent in Blender exporting it like this instead of scaling via ThreeJS so Raycaster detects all children correctly without any problem.
stationMesh.traverse(child => {
if (child.name === 'station') {
console.log(child.name, '_', child.type);
child.material = new MeshStandardMaterial();
child.scale.set(9687.81, 3277.32, 9687.81);
child.updateMatrixWorld(true);
child.geometry.computeBoundingBox();
child.geometry.computeBoundingSphere();
child.geometry.boundingBox.applyMatrix4(child.matrixWorld);
child.geometry.boundingSphere.applyMatrix4(child.matrixWorld);
console.log('Bounding box:', child.geometry.boundingBox);
console.log('boundingSphere:', child.geometry.boundingSphere);
child.geometry.computeVertexNormals();
if (texture) {
child.material.map = texture;
child.material.envMap = scene.environment;
child.material.bumpMap = bumpMap;
child.material.bumpScale = 0.25;
child.material.roughness = 0.1;
child.material.metalness = 1;
child.material.envMapIntensity = 2;
child.visible = true;
}
}
})
stationMesh.traverse(child => {
if (child.name.includes('stationFloor')) {
console.log(child.name, '_', child.type)
child.visible = true;
child.material = basicMaterial;
child.material.side = DoubleSide;
if (child.name.includes('stationFloor')) {
child.updateMatrixWorld(true);
child.geometry.computeBoundingBox();
child.geometry.computeBoundingSphere();
child.geometry.boundingBox.applyMatrix4(child.matrixWorld);
child.geometry.boundingSphere.applyMatrix4(child.matrixWorld);
const boxHelper = new BoxHelper(child, 0xffff00);
scene.add(boxHelper);
console.log('Bounding box:', child.geometry.boundingBox);
console.log('boundingSphere:', child.geometry.boundingSphere);
}
}
})
const rayOrigin = camera.position;
const rayDirection = new Vector3(0, -1, 0);
const raycaster = new Raycaster(rayOrigin, rayDirection);
const testMesh = scene.getObjectByName('stationFloorTop');
if (!testMesh) return;
const intersections = raycaster.intersectObject(testMesh, true);
if (intersections && intersections.length > 0) {
console.log(intersections)
}
I’ve been trying to fix this during 2 weeks. And completely exhausted at the moment. Hope you can help me guys. The root is a parent scaling using mesh.scale.set(). I’d like to be able scaling the parent and detect the children correctly.