solved Meshes From 3ds Max To Babylon Have Strange See-through Effects

[hcmetal]

Hello everyone,

I have been struggling with a strange problem exporting scene from 3ds Max to Babylon.

Some of the meshes end up having strange see-through effects in babylon, like this (you can see the wall and floor in the other room):

Experimenting with the materials, I found that:

Without albedo / basecolor map, the effect is gone (check out the slates on the ground, they are looking normal):

With albedo / basecolor map, strange see-through effect happens (you can see the hidden faces of the slates, giving the illusion of steps):

Related information:

1. 3ds max 2017

2. Max2Babylon 1.3.0

3. Metallic/Roughness PBR workflow. All materials in max are physical materials

4. Meshes have 2 uv channels with occlusionTexture (AO) on channel 2

5. Meshes both with and without multi-material might have this problem (as far as I can see, this effect is pretty random)

6. In the see-through, only the surfaces with alebedo / basecolor maps can be seen, surfaces defined by color properties cannot be seen

7. The see-through happens after a certain glaring angle, meaning if looking straight / perpendicular at the surface there is no see-throught, however as the line of sight gets more parallel to the surface to a certain degree, see-through happens.

Has anyone had similar problems?

Hope someone can point me to the right direction.

Thanks a lot!

[Edit] -  Further discovery: converting the problematic albedo / basecolor maps from .jpg to .png in photoshop solved the problem. There must be something wrong with the .jpg file or some compatibility issue somewhere in the pipeline. I have attached the .jpg files, maybe they are overly compressed?

Edited October 7, 2018 by hcmetal

[Guest]

Pinging @kcoley and @PatrickRyan

[PatrickRyan]

@hcmetal thank you for attaching the jpg files. Would you be able to post a Max file and your output file (Babylon or glTF) so that we can diagnose the whole chain to determine what is happening? If you have a playground with the issue appearing, that would also help repro the issue. I appreciate the help and we will get back to you asap on a solution. 

[hcmetal]

@PatrickRyan, thanks for your reply. I have good news and bad news.

Good news is as I tried to use the old .jpg albedo maps today, the see-through doesn't happen in babylon any more.

Bad news is I cannot even reproduce the problem myself. Maybe this is one of those legendary "3ds-max mythical weirdnesses".

Anyway I have attached the max and the babylon file. Sorry I cannot provide all the textures because of copy-right issues, but we are free to experiment with the max scene and the .jpg files attached earlier.

Hope this will help with the diagnosis. Even if we cannot catch it this time, I will be on the look out and report future occurrences.

Please let me know if you find anything interesting.

Cheers!

handson01_opt_multimat_diagnose.zip

hotel.babylon

[hcmetal]

Ok, guys. It is happening again, like a ghost.

Same story here, change the .jpg albedo map to .png format, the see-through is gone.

I will definitely PG this today.

[hcmetal]

I created a PG with only the case and the .jpg file as albedo, the see-through dosen't happen this time...

PG: https://playground.babylonjs.com/#AASQVX

Notice that Babylon version in the PG (v4.0.0-alpha2) is different from my local project (v3.3.0-rc.4).

[hcmetal]

Here is a new PG with problematic mesh faces on the bamboo model, they are inverted and penetrating each other:

https://playground.babylonjs.com/#RXQXIY#1

This might be caused by the fact that the albedo map has alpha information to make the leaves transparent.

Because the leaves are single faced, I set mesh.material.backFaceCulling = false;

If culling is set to true, the invertion is gone but the z-order of the faces are still wrong.

This might lead to a new problem with transparent albedo maps...

I have also attached the max files and related textures for anyone who is interested in having a look.

bamboo_diagnose.zip

[V!nc3r]

In the 3dsMax exporter, have you the choice of material shader conversion? Because issue is gone when using a PBRMaterial :

https://playground.babylonjs.com/#RXQXIY#2

Can't going further, my max version is too old here

[edit] A quick-and-dirty fix on your playground could be to set transparencyMode to alpha_test, but, not really satisfaying https://playground.babylonjs.com/#RXQXIY#3 [/edit]

Edited October 9, 2018 by V!nc3r

[hcmetal]

@V!nc3r, thanks for your help!

Re-assigning the material in babylon does solve the problem.

However, as I try to understand the docs: https://doc.babylonjs.com/resources/3dsmax_to_gltf#pbr-materials

Phyiscal materials (or any exporter supported shader types) in max are converted to PBRMaterials in babylon, and there doesn't seem to be an option of material conversion in the exporter.

So my understanding is that materials should be converted to (and only to) PBR through the exporter automatically.

Maybe something goes wrong during the export and re-assigning the PBR clears the problem.

This provides a partial but nevertheless practical solution to the problem: Even if the export is sometimes problematic and unpredictable, I can always wirte some batch-material-re-assigning code to "refresh" them.

Thanks again!

[V!nc3r]

If I'm not wrong, by seeing the inspector in your playground

it seems that the 3dsMax exporter use PBRMetallicRoughnessMaterial and not PBRMaterial, maybe it's a lead to follow? Test on the playground get the bug too: https://playground.babylonjs.com/#RXQXIY#4

So it seems that you may spotted a bug on the PBRMetallicRoughnessMaterial shader

[edit] you may try with the gltf format instead of babylon? [/edit]

Edited October 9, 2018 by V!nc3r

[hcmetal]

Wow, thanks so much! 

I never realized that these are actually two different things in babylon.

Will try gltf tomorrow and report back

[Guest]

Pinging @Sebavan

[Sebavan]

So, the issue probably comes from the exporters as the materials as flagged as alpha blend. It would normally be the result of placing the alpha source to alpha in 3DS Max.

@kcoley Could you double check that the setup is correct ?

[hcmetal]

@Sebavan, thanks!

As shown in this PG:

https://playground.babylonjs.com/#RXQXIY#5

I changed the .png albedo map's alpha source from "Image Alpha" to "None (Opaque)" in Max and the Z-sorting / face invertion problems are gone.

However the transparency of the leaves are gone too...

So maybe I have to use alpha-blend?

[Sebavan]

Thanks, it looks like a bug in the exporter cause the transparency mode is always set to Blend to deal with transparency whereas in your case where you want a simple mask it should be set to alpha test:

https://github.com/BabylonJS/Exporters/blob/5b711de23a41f26206559dc32bad73eeeb9c77e0/3ds Max/Max2Babylon/Exporter/BabylonExporter.Material.cs#L383

@kcoley Could you create a fix based on what the standard is checking to deal with Alpha Test ?

I created the issue on the github repo for follow up https://github.com/BabylonJS/Exporters/issues/335

 

[hcmetal]

Great! So I think the quick solution for the time being is to set "mesh.material.transparencyMode = 1;" like @V!nc3r and @Sebavan suggested.

[Sebavan]

yup as a workaround for now cause after it is what will happen in the exporter.

[kcoley]

@hcmetal@Sebavan sure thing, I'll look into this.

[hcmetal]

After reading the docs: https://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered and experimenting with the bamboo, I realized there might be a dilemma here:

1. Transparency mode set to "alpha test" will result in bad anti-aliasing around the transparency borders (which is very obvious from afar), but have no z-sorting or normal-inversion problems;

2. Transparency mode set to "alpha blend" will result in good anti-aliasing around the transparency borders, but have z-sorting and normal-inversion problems, because the model is intersecting with itself and backfaceculling is disabled;

Even if I enable backfaceculling and double the faces of leaves with inverted normals (which might cost some performance?), the z-sorting is still problematic.

So I am wondering what is the best way to deal with this kind of plant models in Babylon...

Is there a better way to break up the model somehow and set proper material types so that the idea combo of "good anti-aliasing" + "correct z-sorting" + "no inverted normals"?

Or maybe the alpha channel in the .png albedo map should be somehow premultiplied (or not) to achieve better anti-aliasing?

This might be leading to a different issue than the original topic of the post, but I think this is a very important topic nevertheless because plants and vegetation are common in both game and arch-viz.

Hope we can work together on this issue and eventually make the bamboo look good

Cheers everyone!

 

[Guest]

Well we have a set of tools to help in this situation: https://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered#things-to-do-and-not-to-do

Technically, you can separate the leaves and make them transparent with a predepth pass. This way you could get both: correct z-sorting (prepass) + good AA

 

[hcmetal]

@Deltakosh, thanks a lot for the tip.

Seperating the leaves from the stems and setting different material attributes has given me the best of two worlds.

[kcoley]

Hi @hcmetal.  I originally tried to author a custom attribute on the textures so you can specify which uses alpha mask or alpha blend, but unfortunately, 3ds Max would not allow me to do this.  So we are going to try to create a custom Babylon.js node that can be used in junction with material in the scene to give you the option to set these properties if it works.

[hcmetal]

@kcoley, thanks! Looking forward to it.

or now I just write some code to set the appropriate transparencyMode for each material once they are loaded into the scene.

[kcoley]

@hcmetal turns out I was able to add a custom attribute to the materials to allow toggling AlphaTest during export.  I just pushed an update to the 3ds Max exporter which supports this.  Feel free to give it a try.

To enable the alpha test toggle, you will have to set a "babylonAlphaTest" boolean custom attribute on your materials.  Setting this to true will enable alpha test mode.  You can use this script for reference:

https://github.com/BabylonJS/Exporters/blob/master/3ds%20Max/MaxScripts/BabylonMaterialAttributes.ms

 

Let me know if you have questions on this.

[hcmetal]

@kcoley, just tried it out. It is working great, thanks!