0

I've just started using Three.js and I've had a few issues, I have a 3d object where I am using local clipping planes to shape to a degree.

But as 3d objects are "hollow" only the outer surfaces are rendered, when something is clipped we can see into the shape and see the back of it. Example, You can see inside the tubes https://i.stack.imgur.com/yfqeO.png

I would like to have these holes capped. Based on this issue, it seems that the best way to accomplish this is to create a surface over the clipped region, thus capping the hole and making the object appear like it isn't hollow. But I'm not sure how to go about this.

This is just using the base code from the examples https://threejs.org/examples/ .

What I would like to achieve https://i.stack.imgur.com/rmb50.png

SeanAbner
  • 63
  • 6

1 Answers1

0

It won't be as fast as using gpu clipping planes but it will give you back actual geometry..

You could try using this CSG library I recently fixed up:

https://github.com/manthrax/THREE-CSGMesh

Suggestions welcome.

manthrax
  • 4,918
  • 1
  • 17
  • 16
  • I have very little experience with Three.js. I'm not sure what this library of yours is for. From what I understand it's taking two meshes and creating a new one based on either subtracting the intersections or where they don't intersect? – SeanAbner Apr 04 '19 at 11:26
  • That's correct. So in your case, you could take your knot model, and subtract a giant box away from it, to get something like what you see in your screen shot. And thanks for the feedback. I should put some better information about what the library is. CSG stands for Constructive Solid Geometry.. it uses an internal structure called a BSP tree to support operations like .subtract, .union, and .intersect, and then generate the resulting geometry. instead of using a clipping plane. – manthrax Apr 04 '19 at 11:29
  • That's close enough to what I want, to add it to a project only the .js file is required?. Sorry if the question seems pointless. Honestly no idea how to implement or use most of this stuff. – SeanAbner Apr 04 '19 at 11:35
  • Yeah. you just need the CSGMesh.js. You can import it like: import CSG from "./CSGMesh.js" Then follow the logic in Example 2. on the github page... replacing meshA and meshB with your knot and a giant cube, respectively. – manthrax Apr 04 '19 at 13:27
  • Are you trying to make a slicer for 3d printing? – manthrax Apr 04 '19 at 13:29