I’m trying to reduce the number of textures required in my .glb files and was hoping to figure out how to create a material that is able to tile multiple textures from a texture atlas. Does anyone here have experience with this?
1 Like
This is a great question and @bghgary is back next week for his GLTF expertise 
Also Maybe @Guillaume_Pelletier has some tricks from the exporters level.
I guess KHR_TextureTransform might be of good use here but not sure how the setup would work.
Oh and I forgot, WELCOME to the community !!!
1 Like
Thanks for the warm welcome and your willingness to help! I’ve been doing environment work for the framevr.io team for a little over 6 months now. We’re trying to find the upper limits of detail that can be achieved in Frame and this would help so much!.
2 Likes
Hello,
KHR_Texture_Transform extension was builded for purpose into GLTF. Keep in mind that texture atlas has drawback such trim, aliasing on borders and mipmap issues.
Several format exist on the topic, such Coco, IOS, json-array, json_hash, libgdx; mapbox, phaser3, unity, unreal, xml… I attach a zip containing sample from all these formats atlas.zip (1.4 MB).
Also the way that this atlas will be processed and optimized by the underlying 3D Engine is another story.
GLTF 2.0 (and i’m speaking under @bghgary control) has introduced KHR_Texture_Transform extension to allow designer and developper choose part of a texture to use. Then it’s perfectly fit with the texture atlas concept.
Let say you have a texture atlas.
Using Babylon to address this texture is simple as applying transformation to the texture
You can play with the KHR_Texture_Transform in a similar way.
If you’re using 3DSMax, you can export your GLB or GLT model applying transfrom to the Bitmap in also a similar way.
giving this GLB result
cubes.zip (397.3 KB)
Pay attention however that we identify an issue on the exportation regarding the KHR_Texture_Transform. We currently address it.
1 Like
Thanks so much for your response. Very useful information here.
I’m realizing the performance gains we’re hoping for might not be possible at this time. Am I correct in thinking that for each texture transform you would need a separate material? At the moment we are limited to a maximum of 6 total materials and 6 total textures. To be able to have more than 6 tiled textures applied to objects in the scene, we would need a single material shader capable of sampling multiple textures and tiling each one separately to achieve what we want. Does something like this already exist? I’m assuming this would take quite a bit of development to implement.
I am still interested in the KHR_Texture_Transform extension however. Are there any dependencies you’d need to reference on the babylon side to get this working, or does it just work? I’m not too familiar with code in general, so I don’t know how it all works. Can I simply open up a .gltf file in vscode and add in extra data from the extension in each material I want to sample a section from the atlas? Is there anything special I need to do on the babylon side to make each sampled section of the atlas repeat and tile correctly?
Thanks again!
Would the texture packer do it for you?
I don’t know of the texture packer. If you wouldn’t mind sending links to some useful documentation pertaining to it’s use, that would be greatly appreciated. In the mean time, I’ll do some snooping myself (I found this: Creating A Texture Package | Babylon.js Documentation ).
It’s probably useful to note that all of our materials are unlit, so we just use diffuse textures with lighting baked in or add lightmaps over tiled diffuse textures.
You can use KHR_Texture_Transform extension without restriction within Babylon, the GLTF loader is taking care of the work for you.
KHR_Texture_Transform is unbounded, so tiling is working.
Regarding optimization, you may create a custom material embeding the atlas and use this material with differents meshes, passing only atlas indices to the shader, or different UV Set.
1 Like
Wonderful that babylon takes care of that extension and that tiling works! I am however very new to babylon and editing the code within gltf. I wouldn’t want you to have to go too far out of your way to help with this, but I think an example in a pg would help me understand how to implement this. I’m most interested in seeing an example of a tiling texture being sampled from a texture atlas that includes multiple textures and being successfully tiled multiple times on a single face. the custom material that uses the same atlas, using different quadrants of a texture to tile different uv islands sounds like exactly what I need. It sounds like that would be pretty complex to set up though.
I noticed that when I export as .gltf from blender, no materials are included. When I export as .glb there is no problem with the materials, but then I can’t edit the json file. Is there a way directly in blender to export KHR_Texture_Transform data in the glb or would I have to do this manually? Again, sorry for all the questions and confusion. Very new to this!
I’m not aware of all the last ehancement in Babylon js and noticed that custom material and shader management changed “a bit” since my last use, so i give the hand to others who know this better than I. Also blender exporter is not my area of expertise.
G.
I sounds weird that Blender allows texture transform in glb and not gltf, this might be a configuration export issue
Adding @PirateJC who has usual Blender fun to see if he can help
In case you doesn’t know this technique, you may be interested by the Trim Sheet method: you’re not doing the tiling using the material, but using the mesh, here an example: https://www.artstation.com/artwork/OovX1g (one atlas texture for the entire building).
This has the advantage to not using code (but does not answer about tiling a part of an atlas 
)
1 Like
This looks really nice! So, in this case you’re manipulating the uvs in such a way to repeat a tiling texture rather than having proper tiling on the shader level. That may be a good workaround until we find a more sophisticated method of doing this. It’s really lovely to be able to alter the scale of a texture at any point, but I do like the idea of trying this out in the meantime.
I think this is more of a misunderstanding on my end about how the two different formats are exported. I just noticed that when I exported a model as a glb and imported it back into blender there were textures and there weren’t any textures on the model that I exported as gltf when imported back into blender
.
@Sol_Hunter - Welcome to the Babylon family! We’re big Frame fans around here, so you’re naturally a part of the family
Sounds like you’ve already figured out the difference between .gltf and .glb and the export from Blender.
.glb files wrap a .gltf and associated textures together into a compressed format. .gltf by itself does NOT include textures, but rather links to textures.
1 Like
Thanks for the warm welcome! I love being a part of the Frame team and I’m very happy to be diving a little deeper into babylon.js now!
Ah, thanks for the clarification! Good to know I wasn’t doing anything wrong.
Do you happen to know if there’s a way to (within one material) sample multiple sections of a texture atlas and tile those sections individually on different face sets of one mesh?
1 Like
This doc should help:
If I understand the issue you’re asking about there are several different examples on this page of how to apply different “cells” of a texture to different parts of a mesh.
Here’s one:
https://playground.babylonjs.com/#ICLXQ8#1
Thanks for this resource, JC! However, this doesn’t allow for the tiling I’d like to achieve as far as I can tell. Here is a scene I made to test out a method of tiling textures from a texture atlas by tiling geometry. Here, I’m tiling textures by duplicating a plane which has uvs aligned with the texture I want from a texture atlas, then applying a lightmap over that so i can get realistic lighting and high levels of detail at relatively low computational cost. I’d like to achieve results like this without having to create the tiling by manipulating the geometry. This is a perfectly fine workaround at the moment, but I’d like a more sophisticated solution that allows more procedural control over the tiling of each texture.
1 Like
Curious for your thoughts on this one @PirateJC ! And we are so excited to show you some of our upcoming environments as well 
2 Likes