I've been experimenting with creating cross-sections of an OBJ file loaded using the three.js OBJ loader and the threeCSG wrapper for constructive solid geometry in JavaScript.
When working with a regular mesh, like a sphere or cube, the intersection csg operation works perfectly. I can also create visually appealing cross-sections with the obj in its original position (white object with red cross-section displayed below).
However, once I rotate the object, the cross-section remains the same regardless of the rotation applied:
Is there a way to have the csg intersection operation consider the rotation of the object? It behaves correctly with a standard three.js mesh (cube).
This issue may be related to how three.js loads OBJ files—it seems to store multiple meshes within a parent object that can then be manipulated in a scene. Here's how I'm currently performing the csg operations:
threeOBJ.traverse( function ( child ) {
if (child instanceof THREE.Mesh) {
cc = crossSection( child );
scene.add( cc );
}
} );
The crossSection()
function conducts a csg intersection operation with the blue transparent plane visible in the images and each child mesh. It outputs a THREE.Mesh that is subsequently added to the scene.
I suspect I may be referencing something incorrectly since the rotation is not being factored in, but I don't know what that might be. Is there a more effective way to utilize csg with OBJs loaded in three.js? Perhaps consolidating all child meshes into one parent mesh and then executing boolean operations could yield better results?