Hello everyone!
I have an issue with rendering the Hourglass-like shape. It is rendered like a Z shape that is closed.
When applying the color to the material, it does not fill the hourglass shape as expected (SVG renders such path just fine with the correct fill) but just fills a triangle on one side of the shape. Am I missing something, or is it a Threejs issue?
Attaching the fiddle with an example: https://jsfiddle.net/v5xpk813/6/
Thank you for any answers.
You have to define the contour in CCW order. Or at least keep the winding order consistent, which was not true in your case. I’ve simplified your fiddle a bit to show by using ShapeBufferGeometry in order to demonstrate a valid shape definition.
Thank you for your answer.
It is not quite the result I’m expecting. Can you please check again the fiddle, I’ve updated it with the SVG
How about this?
@Mugen87, Yes, this is what I need.
The problem is, I get the path as an input as is. Wish Threejs could render it that way.
But it seems the path can be converted to this form, though quite a pain.
Anyway, thank you for the help! At least I see the direction now 