Search code examples
3dthree.jscsgthreecsg

threeJS / threeCSG - stray edges on coplanar faces after threeCSG boolean functions when using EdgesGeometry


I am using EdgesGeometry to show the outer edges of the mesh as so : EdgesGeometry( geometry, thresholdAngle ).

This normally works as expected but after a using threeCSG to either 'subtract' or 'union' and then generating the EdgesGeometry on the resulting mesh I get various stray edges appear on coplanar faces, even if I increase the 'thresholdAngle' to say '180 degrees', they remain.

This is what happens - enter image description here

Here's my code: (a & b are the meshes of the box geometry)

a_ = new ThreeBSP( a );
b_ = new ThreeBSP( b );

c_ = a_.subtract(b_);
c = c_.toMesh(mat_cube);

scene.add( c );

edges = new THREE.EdgesGeometry( c.geometry, 5 )
line = new THREE.LineSegments( edges, mat_line )
scene.add( line )

anyone got any ideas? thanks

UPDATE

below is what it looks like with 'WireframeGeometry'... enter image description here


Solution

  • You are seeing unexpected "edges" when rendering with EdgesGeometry.

    The cause is an artifact of the output of threeCSG.

    The long edge of the large triangle is coincident with edges of three smaller triangles -- coincident, but not shared.

    That means, the long edge is not shared at all. Nor are the three short edges.

    Edges that are not shared are rendered by EdgesGeometry.

    three.js r.87