What are mesh.flipFaces(), flipNormals & sideOrientation?

Hey folks,

Just generally feel confused among these 3 concepts.

Before I thought flip faces = flip normals. But in mesh API doc, under Mesh.flipFaces() , it takes flipNormals as an argument…So it makes feel “flip faces” and “flip normals” are 2 difference things…can anyone help understanding this?

Also, I ran into some other concepts on materials. Material.sideOrientation = BABYLON.Material.ClockWiseSideOrientation; is one of them. I know sideOrientation means deciding which side of the face is front and which is back. But what does “ClockWiseSideOrientation” and “CounterClockWiseSideOrientation” mean the other hand? I feel this property is somehow related to flip faces and normals but not really sure…can someone help too?

Also here are some other concepts confuses me too:

  • twoSidedLighting
  • DOUBLESIDE / FRONTSIDE / BACKSIDE ← I know their definitions but just trying to understand their relation to other above concepts…

These are related topics I have found:

Many thanks,
Tawibox

Hello!

About clock and counter clockwise, they are always referenced to the hand coordinate system you’re using:

image

If you align the thumb of your hand with the normal of a face and rotate your hand, you’ll see if the vertices are clockwise or counter clockwise:

image

This video offers a nice explanation about it: (3) [Episode 15] Rendering a Quad (And Understanding Winding Order) - Modern OpenGL - YouTube

Just remember that for the video, it uses OpenGL coordinate system which is right handed, while Babylon is left handed by default.

I think the video will do a better explanation than me to explain why flipFaces and flipNormals are different. Flip faces will flip the winding order (which is the clockwise and counterclockwise thing), while flip normals just reverses the direction of the normal. You can see it on the code here: https://github.com/BabylonJS/Babylon.js/blob/41cb891508d8f008f97e85e206a155a97d296e9f/packages/dev/core/src/Meshes/mesh.ts#L3154

2 Likes

@carolhmj Thank you so much for the response! Yeah this is great! Will read them through!!

Many thanks again!!

1 Like