simon_bg Posted February 11, 2016 Share Posted February 11, 2016 Hello guys, I have a problem related with material swapping and asynchronous texture loading. I have a tiled map, and when zooming in the visible tiles swap to a material with a higher resolution image texture. The thing is, the tiled map I have is pretty huge, it has lots of tiles and the images are heavy. What I did until now is just initializing all the materials and textures during the loading screen, loading both the low and the high resolution tile images. Then, the tile swapping works really smooth and is practically unnoticeable. The problem is, for big scenes it takes just too much time loading all these images at the start. So lurking around the babylon.js source code, I've found the flag useDelayedTextureLoading in the Scene class. I use scene.useDelayedTextureLoading = true, and still initialize the textures at the beginning (which is really fast now, of course), but the images are actually loaded when they are really needed (when swapping the tiles), which is cool. The thing is, the swapping is not that smooth now, the tile material "disappears" for a fraction of second and then appears with a new, higher resolution. Having multiple tiles disappearing almost at the same time is very noticeable. I've set up a demo here. It's a very simplified version of what I have, but you should see the tiles disappearing for a moment when zooming in the camera for the first time: http://www.babylonjs-playground.com/#1XBLWB#116 So I tried to solve this in this way: Create a "buffer" mesh, hidden somewhere under the map and when it's time to switch a tile with a higher resolution image I apply the material on the buffer mesh first, so the "special effect" of the disappearing material takes place there. Then, once the texture is fully loaded, I would use the texture.onLoad() method and apply the loaded texture on the right tile. But... it looks like when scene.useDelayedTextureLoading flag is set to true, the Texture constructor callbacks onLoad and onError are ignored?.. So.. I thought it was time to ask you for advice . Maybe you have an idea of how can I fix my solution, or you can come up with a different solution, anything would help. Maybe I'm just complicating the whole thing too much. Thanks!! Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted February 11, 2016 Share Posted February 11, 2016 This seems smart but if the mesh is hidden it will never trigger the texture load Quote Link to comment Share on other sites More sharing options...
simon_bg Posted February 12, 2016 Author Share Posted February 12, 2016 Oh shoot! You're right. Some other ideas I had is having a "placeholder" for my texture, like when the right texture is loading it just would show the placeholder texture instead of disappearing. Would it be possible to implement? Or even having two textures overlapping, so when one texture disappears the other is still there, if it makes any sense. Also, what does the "buffer" in the texture constructor means? new Texture(url, scene, noMipmap, invertY, samplingMode, onLoad, onError, buffer, deleteBuffer) Could it help me using it in any way? The best solution I think would be still to just leave the current texture until the new texture is fully loaded, but again, I don't know how to do it Quote Link to comment Share on other sites More sharing options...
simon_bg Posted February 12, 2016 Author Share Posted February 12, 2016 15 hours ago, Deltakosh said: if the mesh is hidden it will never trigger the texture load And also... if instead of hiding it under the map, I place it somewhere the camera can see it, but make it very, very small, so it would be undetectable? Kind of a nasty solution, but desperate times call for desperate measures haha Quote Link to comment Share on other sites More sharing options...
julien-moreau Posted February 12, 2016 Share Posted February 12, 2016 Hi simon ! The buffer is used (and optional) to load a texture from an array buffer (DDS or TGA) or a base 64 string (PNG, JPG). The url must begin with "data:" like "data:myTextureName" The last parameter tells if the buffer (array buffer or base64 string) should be deleted after the texture was initialized Quote Link to comment Share on other sites More sharing options...
simon_bg Posted February 12, 2016 Author Share Posted February 12, 2016 Oh ok, got it. So I think it wouldn't help in my case, but thanks anyway for your response, Luaacro! Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted February 12, 2016 Share Posted February 12, 2016 Here are some ideas: - You can have a mesh with a material where alpha = 0 (so not visible BUT rendered) which can host your texture - You can also think about using diffuseTexture AND ambientTexture to alternate between your layers Quote Link to comment Share on other sites More sharing options...
simon_bg Posted February 12, 2016 Author Share Posted February 12, 2016 Okay, thanks! I'll try this out Quote Link to comment Share on other sites More sharing options...
simon_bg Posted February 15, 2016 Author Share Posted February 15, 2016 I still don't get why when scene.useDelayedTextureLoading flag is activated, the Texture onLoad() callback is never triggered though Like here,http://www.babylonjs-playground.com/#1XBLWB#119 the onLoad() never gets called, but if I delete the line 37 with scene.useDelayedTextureLoading = true; it does get triggered. Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted February 16, 2016 Share Posted February 16, 2016 Hum this is because we don't call it when using delayed flag. I'll fix it for next commit Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted February 16, 2016 Share Posted February 16, 2016 https://github.com/BabylonJS/Babylon.js/commit/72305fd782512917b610be8ed75f3dc16a4ce2dd simon_bg 1 Quote Link to comment Share on other sites More sharing options...
simon_bg Posted February 17, 2016 Author Share Posted February 17, 2016 Great! Thanks, Deltakosh! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
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.