Rhino make2d in threejs

has anyone ever made Make2d In threejs similar to make2d in rhino?

I was thinking maybe using raycasts from the camera to the model but it might be too much. I have a 3d gltf house model in threejs, and i want to make the front of the house 2d. By getting all the meshes that are seen in the front and then turning it to two points. I was thinking of using raycaster. I want to make sure that i can get each individual mesh, and their properties seprately so it can be drawn separately.
I know there is the repo three-edge-projection, but i want to know how to do it myself. Can anyone explain?

The issue with just using Raycaster is the speed - what three-edge-projection is using is three-mesh-bvh which greatly speeds up raycasting. So you can code the raycasting manually but, inevitably, you’ll end up with ProjectionGenerator from three-edge-projection.

Or what you mean is that you’re looking just for the theory behind edge projection? (cc/ @gkjohnson )

The three-edge-projection project doesn’t use raycasting at all. Rather a set of candidate edges to display is generated first (based on angle to the projection, angle between faces, and some other qualities) and then bvh is used for each line to find triangles that will hide a portion of that line. The remainder of the lines are then converted to an object and displayed.

The code is all open source, though, so if you’d like to understand how it works I recommend taking a look at the ProjectionGenerator implementation.

3 Likes