Draw complex profile arcs, lines, curves, extrude to mesh

I am looking for a way to draw a complex closed path of lines, arcs, and potentially curves, then extrude that into a mesh that I can use to subtract from another mesh using CSG. Is this possible? Picture the need to draw a Sprocket or a Gear. Generally you start with a Cylinder, and make “cutouts” of the teeth.

Any ideas?

Possible… yes. Basically, the way you describe it. But I have to warn you of a potential ‘blackhole’ that I believe has not been fixed and will eventually never be fixed with extruded meshes and CSG. All I can tell you is that I kind of recall this thread (below). I didn’t try further since.

1 Like

Not sure this is “as bad” as that example, but who knows, maybe its worse. Before I sit down and crunch all the numbers to get it converted, I am trying to asses if this is even worth trying to do. See attached images that came from our CAD software. I am trying to do the same type of thing for our online configurator to show a 3D representation of the parts. Just based on the images, see any concern?



Honestly, I’m not qualified to answer this. I’m no industrial designer and this leaves me with more questions than answers. So, I will just let someone else give you guidance on this. All I can say is that likely the interpolation between points could become a problem. As far as I know there’s not just a hell of a lot of flexibility in BJS to control this from point to point when using a path. For the rest, truly, I don’t know.

The only real thing that comes to my mind is “Why do you need to do this in BJS”. I mean, I suppose it’s not just to reproduce this model? Else, you would be better of just using the imported mesh. So, what’s the trick with the ‘configurator’? Can the user configure the parts, and then if so, I believe with constraints. Again, it will not be me enlighting you on this, but this information could be useful for the others. :thinking: May be just wait until tomorrow. Someone from the Team will likely kick-in.

No worries, and I appreciate your responses no matter what.

The images were a basic example (of course), the configurator can change the tooth profile based on 20-30 different chains, numbers of teeth, number of strands, etc. There are hundreds of fields that change what the part will look like so a single (or even a few) imported model won’t work. We have CAD integration already, but the CAD systems are slow, not on the web, and I am looking for a solution that can keep up with each change the user makes. I tried ThreeJS first, but it doesn’t do CSG very well.

I found Path2D in the documentation, does that give me the ability to draw a profile, and extrude it as a mesh?

1 Like

Thanks for details. Important to get an understanding of the scenario.
As I said (and suspected), beyond my reach :dizzy_face: however, just high-level

I believe if you would be able to draw the profile in a 2D environment would be easier and makes sense to me. I sort of recall previous threads around this but not really enough to give proper feedback.

I think @PatrickRyan would probably be the person who could give you the best input towards the approach to take and the challenges you will face. However, with the imminent launch of v7, I’m not sure he would have the time for this. May be he can call-in someone or quickly orientate you, can you? At least, the idea of challenging three.js is always something that motivates us :joy:

One thing that’s clear to me is you don’t want to go into building on this without a solid logic and later discover that you cannot make it work and/or manage it properly.

I hope you’ll get the right feedback soon and meanwhile, I shall wish you a great day :sunglasses:

I think you can use extrudeShape to create the shape:

https://doc.babylonjs.com/features/featuresDeepDive/mesh/creation/param/extrude_shape

Regarding CSG, it doesn’t always work as expected and can be slow (search for “csg” on the forum, there are a number of posts about it), so the best advice would be to make a simple example and see if it can work for you.

An other idea…

The MeshBulider.CreateText uses a json.data to draw the fonts.

This data representation looks like path coordinates used in vector graphics. It appears to be a sequence of commands and coordinates that define the shape of a path. Here is a brief explanation:

“m” stands for “move to” and indicates the starting point of the path.
“q” stands for “quadratic Bézier curve” and defines a Bézier curve with an anchor point and an end point.
“l” stands for “line to” and draws a line to the specified point.
The pairs of numbers after each command represent coordinates. For example, “m 1129 496” means that the path starts at the position (1129, 496). “q 1123 411 1129 454” means that a square Bézier curve is drawn that has the anchor point (1123, 411) and reaches the end point (1129, 454). And so on for each command in the path.

1 Like

Always wanting to disrupt the system, are you? :grin: I guess you know by now how much I am admirative of your creative and logical thinking, always pushing the bounderies using the BJS versatility.
Still, in this case scenario, using a method that’s called ‘createText’ to draw industrial design parts would make me worry (as a PM and artdir) :grin: :sweat_smile:

1 Like

I tried it, created a scene in the playground, and it looks like it will work, but put on to a separate posting an issue I found while trying it:

But assuming that issue can be resolved, I think this is the direction I will take.