Jump to content

How to get the normal of a face in a plane (not a vertice)


Recommended Posts



Yes, me again ... :)


So, I still have my plane with some face (triangle) compose by 3 vertex.


I can get the face ID, get the 3 vertex which compose a face, get the normal of each vertex but now, I would like to find how to get the normal of a face (not the all plane, just one face) ..


I try with the function getNormal() (pickingInformation) but each time that return x=0 y=1 z=0, but some face are inverted and the function return the same result I don't know why

Link to comment
Share on other sites

Hey again,


This is where it's done in the BJS code (used for converting mesh to flat shaded): https://github.com/BabylonJS/Babylon.js/blob/master/src/Mesh/babylon.mesh.ts#L1102


Basically the normal of a face is the cross product of two of its three sides, but you have to compute it yourself (this data is not stored, unlike vertices normals).


Good luck :)

Link to comment
Share on other sites

Thank you ! It's done and it's working :)

 var positions = plane.getVerticesData(BABYLON.VertexBuffer.PositionKind);scene.onPointerDown = function(evt, pickResult){                               if(pickResult.hit){                    faceId = pickResult.faceId;                    var vertex1 = BABYLON.Vector3.FromArray(positions, indices[faceId * 3] * 3);                    var vertex2 = BABYLON.Vector3.FromArray(positions, indices[faceId * 3 + 1] * 3);                    var vertex3 = BABYLON.Vector3.FromArray(positions, indices[faceId * 3 + 2] * 3);                    var p1p2 = vertex1.subtract(vertex2);                    var p3p2 = vertex3.subtract(vertex2);                    var normal = BABYLON.Vector3.Normalize(BABYLON.Vector3.Cross(p1p2, p3p2));                }}
Link to comment
Share on other sites

  • 3 years later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...