Jump to content

When exporting the glTF file with Babylon.js Inspector, the polygon is inverted


cx20
 Share

Recommended Posts

I tried exporting glTF file using Inspector of Babylon.js Sandbox. However, it seems that the polygon is inverted and displayed.

The version of Babylon.js is v3.3.0-alpha.11.

I think that it is because FRONT_FACE is not CCW but CW.


image.thumb.png.6b19e585813e9103bcd4f38a3d762bc4.png

image.png.5aec0076991293331a22988af979c0d5.png

image.thumb.png.53316157d68afa05cd1a7bb43b77ac9f.png

Link to comment
Share on other sites

I confirmed that this problem was solved with the inspector of Babylon.js Sandbox.

https://sandbox.babylonjs.com/

The version of Babylon.js is v3.3.0-alpha.12.

 

However, downloading the latest version of babylon.glTF2Serializer.js from the repository of Babylon.js and testing it locally did not seem to work properly for some reason.

https://cdn.rawgit.com/cx20/gltf-test/a8d9825ff50b29b50d545548c9e0ba1cc0380732/examples/babylonjs/index.html?category=tutorialModels&model=WaterBottle&scale=10&type=glTF

The version of Babylon.js is v3.3.0-alpha.12.

image.png.5bb10ced2d417c00827ad564a3b2a46a.png

image.png.f421e14fb9908837d8461f2c586a1724.png

image.png.febfaabd0ed622e587e2ae8b5c108ff4.png

image.png.677eb549eef99a271e2243b27f64296f.png

There should be some difference, but I have not yet arrived at the cause:(

 

 

Edited by cx20
Unnecessary images deleted
Link to comment
Share on other sites

I understood what kind of situation it will go wrong.

I am changing the scale of the model in the sample program displaying my glTF, but it seems that exporting can not be performed correctly if it is not 1.0.

NG : https://cx20.github.io/gltf-test/examples/babylonjs/index.html?category=tutorialModels&model=WaterBottle&scale=10.0&type=glTF

OK : https://cx20.github.io/gltf-test/examples/babylonjs/index.html?category=tutorialModels&model=WaterBottle&scale=1.0&type=glTF

However, I do not know how to fix it. Are there any advice?

https://github.com/cx20/gltf-test/blob/master/examples/babylonjs/index.js#L76

parentMesh.scaling = new BABYLON.Vector3(modelScaling.x * scale, modelScaling.y * scale, modelScaling.z * scale);

 

Link to comment
Share on other sites

Hi @kcoley, Hmm. I tried it again, but it seems to reproduce.

It reproduced with the following combination.

Windows 10 Version 1803 + Chrome 67.0.3396.99 
Windows 10 Version 1803 + Firefox 61.0.1
 

The reproduction procedure is as follows.

1. Go to the following URL. 
https://cx20.github.io/gltf-test/examples/babylonjs/index.html?category=tutorialModels&model=WaterBottle&scale=10.0&type=glTF

Set the scale parameter to 10.

2. Check "Debug" on the control panel

image.thumb.png.275567040c22cd90182901329a2284a4.png

3. Select glTF menu from the inspector window.

4. Click the "Export GLB" button.

image.png.2853a8a390334f57080e9416270bce25.png

5. Download the export file.

image.png.aa54164d93632c3638f31184aac11e74.png

6. Drag and drop the glb file into the glTF Viewer.

https://gltf-viewer.donmccurdy.com/

image.thumb.png.6ce052a41778d0b62a75f2f3448cda68.png

7. Please look at the display result.

image.png.549a08158a2441797c7ba6b0d6e385dd.png

 

Link to comment
Share on other sites

@kcoley Thank you for fixing Issue.

However, it seems that the latest version of glTF Exporter is not created by nightly build. This is because the timestamp is in a state one day ago.

Could you check if the latest version of glTF Exporter was created?

https://github.com/BabylonJS/Babylon.js/tree/master/dist/preview release/serializers

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