Jump to content

notMe
 Share

Recommended Posts

Hello all,

I am trying to learn Babylon.js by making a simple game. But I have a problem. Some of the tiles I drew  in Max2017 export wrong to babylon.js. Export to Substance Painter using a .FBX works and gives no problems.

They are simple models and I don't see any faults, I have attached an image how it looks in Max and made a playground how it looks in Babylon.js, at some angles you can see through the faces to see the parts behind it.

http://www.babylonjs-playground.com/#1UQADD#6

Can anybody see what I am doing wrong?

tile.png

Link to comment
Share on other sites

First of all, welcome to BabylonJS! We are happy to help you with questions as you are working on your game. What you are seeing is that your mesh is writing into the transparent queue as Max saw there was alpha values on your material and vertices and placed it into the transparent queue. When you have a complex mesh in the transparent queue, you will see sorting errors as it does not have the benefit of a depth buffer and does not know what face should be in front in all viewing angles. Here are a few things you can do:

  1. I would suggest exporting your files from Max as a glTF file as you can load that directly in BabylonJS, but also take advantage of the many glTF viewers that are available like the BabylonJS Sandbox (https://sandbox.babylonjs.com/), Mixed Reality Viewer for Windows, Sketchfab, etc. This gives you a way to debug what is happening in your mesh by being able to see how several renderers deal with the file. If you see your issue pop up in one of the other renderers, you know the issue is in the file. 
  2. I would avoid placing color on your vertices unless you really need to for some reason. It's much easier and will create a smaller file to assign materials to your meshes. If you have alpha on your vertices, you will end up with the mesh in the transparent queue as the exporter will see the alpha and set the alpha mode accordingly.
  3. To set up your materials correctly in Max, refer to the docs at http://doc.babylonjs.com/resources/3dsmax_to_gltf#pbr-materials for reference. You will need to make sure that your transparency weight is set to none to make sure you output your model in the opaque queue.
  4. If you still have an issue with the export to glTF, you can easily open the glTF file in an editor like VSCode (https://code.visualstudio.com/) and quickly change the alpha mode to the correct format which is detailed on this page:   https://github.com/KhronosGroup/glTF/tree/master/specification/2.0#alpha-coverage
  5. VSCode is also another place that can view your glTF file by adding the glTF extension. You can search for glTF in the extensions tab and you will find it. 
  6. If you need your asset to be double-sided, you can add the double-sided property into your glTF manually: https://github.com/KhronosGroup/glTF/tree/master/specification/2.0#double-sided and an example can be found in https://github.com/KhronosGroup/glTF-Sample-Models/blob/master/2.0/FlightHelmet/glTF/FlightHelmet.gltf line 535. 
  7. There is a blog post I wrote about the art pipeline into glTF, which is a little dated now and I am working on an update. It shows how you can even export your glTF directly from Substance Painter if you like. You can find it at https://www.khronos.org/blog/art-pipeline-for-gltf

Let me know if anything here does not make sense or if you have further questions about your asset creation. Take care!

Link to comment
Share on other sites

Thanks for the help,

The problem was indeed a fault with the vertex transparency in Max. The alpha value was 100,0  but if the value was something else before and is set back to 100 Max doesn't always see that alpha 100 is not transparent, maybe an invisible rounding error.

solutions I found

  • editing the babylon file in a text editor and set the property  hasVertexAlpha to false (for error finding only)
  • export the mesh as an OBJ and import it again in Max
  • export as a glTF file instead of .babylon, for some reason this didn't gives the transparancy problem
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.

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

Loading...
 Share

  • Recently Browsing   0 members

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