ExtrudeShapeCustom: Close Path?


A loud hello to the Babylon community!

I’ve just started programming with the Babylon Framework and have already gotten into a problem:
How do I close the extrusion I create with ExtrudeShapeCustom?
An example should illustrate this: https://www.babylonjs-playground.com/#QBC29E.
The triangle will later be replaced with different shapes. The path should be extruded closed.
What do I have to adjust or add to make this work?

What you’re seeing is due to extruding from one side of the triangle instead of extruding from the center of the triangle.



Thank you for your prompt reply.
However, extrusion takes place from the center. I have not found a solution yet …

Close the underlying ribbon array https://www.babylonjs-playground.com/#QBC29E#2

@olli2home @JohnK

I already tried to close the triangle extrusion, which is why I assumed the triangles were extruding from an axis not in the center of the triangle. But if it is extruding from the center, I’m not certain how to close the extrusion in his playground scene.


PG I posted is closed (is it not?) note ribbonCloseArray parameter in the ExtrudeShapeCustom


Yes, I see. I tried this, but I must have made an error. Thank you for solving this. :slightly_smiling_face:


1 Like

Thanks for the answers.

But the problem is not solved. This becomes clear when a texture is applied.

Here is a screenshot: http://download.fam-nestler.de/babylon_01.jpg

That’s disappointing. Will have a closer look again tomorrow. If @jerome has time perhaps he can spot what we have missed.

Maybe try this :
change the triangle position in its local system, then extrude : https://www.babylonjs-playground.com/#QBC29E#3

then close the ribbon : https://www.babylonjs-playground.com/#QBC29E#4


That said, if you really want to close an extruded circular shape, you may consider build your own ribbon around a a set of (three) circular paths because there’s quite no chance that the extrusion process sets the first step of the shape (your triangle) in a radial orientation to your circular path.

What I would do then ?
Build 3 arrays of vertices, each defining a circle parallel to the others, all having the same rotation axis. Then build a ribbon on these 3 arrays and close it. You then be sure that every step (triangle) will be radial to the circle.

1 Like

@olli2home as I did not solve it the first time here is a solution based on @jerome’s method


Notice that the 0 index path point is not added to the end of any path array and the closeArray and closePath option parameters are set to true.

This gives a better joint than closing paths with path.push(path[0]) as in https://www.babylonjs-playground.com/#TL281S#1

1 Like

Thanks for the answers.

I will not have time until the weekend to take a closer look at the solutions and to test them. The solution with the ribbon looks good.

Thank you

Thanks to all. The solution with the ribbons worked.

1 Like