Jump to content

OpenGL vs. DirectX normal maps


Recommended Posts

It seems that BabylonJs uses the DirectX convention for normal maps.
The problem is that our material database uses the OpenGL convention. The bump direction seems to be inverted now in BabylonJs.
How can i switch between OpenGL and DirectX normal maps in BJS?
I think the green(y) channel needs to be flipped in order to convert between OpenGL and DirectX normals.
I would like to prevent a conversion of our material database because our whole toolchain is based on OpenGL conventions.
Would it be possible to add a flag to the material/texture to switch between opengl and directx normal maps?

Link to comment
Share on other sites

1 hour ago, Deltakosh said:

here is a way for you to fix it:


Thx for your answer. I was thinking about doing it manually with canvas already ... i will keep it in mind as a last resort :-)
I was hoping for direct support for different normal maps in babylon js. This could be done with a small define in the default fragment shader i think.
BJS would benefit from supporting different kinds of assets without the need for conversion. It would be more universal this way.    

Link to comment
Share on other sites

@Deltakosh i just tried your change but it is not working as expected.
It was correct to invert the y component but it seems that also the x component must be inverted.
I dont know which convention you implemented for the normal mapping in BabylonJs but it doesn't seem to be DirectX.
Here a playground: http://www.babylonjs-playground.com/#17QZZM#3
The light is coming from top-left (see the sphere) but the light on the bump map is coming from top-right.

Could you change it please that if useOpenGLNormalMap = true the x and y compenten is inverted?

Link to comment
Share on other sites

1 hour ago, Deltakosh said:

You flipped y which is correct. But as you can see in my playground, its not enough to support opengl normal maps correctly.
x also need to be flipped. So it would be nice if you could flipp x and y.
Or even better add two flags to the material, one for x and one for y. This way all kind of normal maps can be supported.

i just checked it with CrazyBump:
x-axis = right
y-axis = up

x-axis = right
y-axis = down

x-axis = left
y-axis = down

Link to comment
Share on other sites

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...