glTF import with custom extensions

[hummerbaendiger]

Hi everyone,

I'm quite new to babylon JS and need a small bump into the right direction ?

Hoping not to fall for the XY Problem here's what I want to do:

Going from a model created for Unity, that use special shaders, I want to export these to a WebGL solution. That way I can display these models on any supported browser (even mobile since Unity WebGL is not supported by most)

My Approach:

• Create model in Unity3D with custom Shaders - done
• Export model to glTF, adding a custom extension to the material that holds all relevant information (specular maps, UV mappings, custom material properties that exceed the standard shaders) - done, made a special extension for the Unity exporter that handles my materials
• Import glTF to babylon and read out the custom material properties stored in the material extension - this is where I'm stuck
• Adapt the special Unity shader to work with the WebGL environment of babylon JS
• Display the model with custom shader and settings stored in glTF file

Can someone tell me how to read custom extensions from GLTF within babylon JS? From the documentation I know that for now only the standard extensions are supported (KHR_Materials, draco compression, MSFT_lod, ...). Where do I have to start if I want to add a custom plugin or behavior for the glTF importer that understands my custom material extension?

 

Thanks for your help :)

[Guest]

pinging @bghgary who can provide guidance

[bghgary]

@hummerbaendiger This isn't currently easy to do without relying on non-public interfaces. I will try to add a mechanism for you to do this, but it might take a bit of time.

[hummerbaendiger]

Thanks for the follow-up

I already downloaded the Git repository from https://github.com/BabylonJS/Babylon.js. This should also include the implementation of the basic glTF loader (babylon.glTFFileLoader.ts if I'm right). But I can't find where extensions (like "EXT_texture_transform") are handled.

Also I think I'm somewhat confused with the naming of "extensions" and "plugins". Do I understand correctly that within babylon JS a "plugin" is something like the glTF loader itself or the physics engine? I think the name "extension" in the context of babylon JS has a different meaning from the "extension" in the glTF file format (which is rather a file extension like .jpg)?

In general I wouldn't mind doing a custom implementation just for my case - Which would be to read extra parameters stored in the glTF file (as custom extension property) and build up the scene in babylon using these parameters. I just don't quite understand where I would start or if there is already a mechanism that is intended for sort of a "plugin for the glTF loader".

Geez, I hope this isn't totally confusing

Thanks for your help

[bghgary]

Yeah, the naming is overloaded. I'll try to explain a bit.

There are SceneLoader plugins which support specific file extensions (such as obj, stl, and gltf/glb). The glTFLoader is one of these plugins which support the gltf/glb file extensions. The glTFLoader plugin has glTFLoader extensions that separate certain functionality of the loader into separate classes which helps with organization and maintenance of the code. Finally, there are glTF extensions which are extensions to the glTF format. All of these glTF format extensions have a corresponding glTFLoader extension (e.g. KHR_materials_pbrSpecularGlossiness, KHR_draco_mesh_compression, etc.) The glTFLoader currently does not have a public facing contract for adding glTFLoader extensions and mostly this is because the glTFLoader extensions interface is not very stable and I often have to change it to accommodate new extensions or fix issues. I will work on something that will help with this, but it will require some time.

Short-term, if you are okay with relying on interfaces that might change, you can use the extension mechanism that I'm doing with the glTFLoader using typescript. The other option is to use Babylon Toolkit until I can provide you something to extend the glTFLoader more easily.

[hummerbaendiger]

Thanks again for the information!

I wasn't even aware of the Babylon Toolkit  - this might make the whole process even easier (since I'm not really skilled in JavaScripr / TypeScript yet ). I'll have a look into it as well. 

But once I have some more practice, the native implementation would probably make the final solution a lot smaller in size. I can imagine going from Unity will add quite some overhead...

[bghgary]

See here for the first PR that supports adding custom loader extensions: https://github.com/BabylonJS/Babylon.js/pull/4845