Forum

Why can not replace environment texture from JS.

14 September 2018 12:37
Hi.
I want to replace to environment texture on in-game from Javascript.
I found this tutorial but my situation is not working that. I don't know why doesn't working my situation.
Could somebody tell me what is different about my case and the tutorial case?

_world = m_scenes.get_world_by_name("World");
m_tex.replace_image(_world, "Mymap", _EnviromentMaps[0])


My Blender files include "Mymap" in World object.

Javascript returns here.
B4W ERROR: Couldn't find texture "Mymap" in object "%meta_world%World".

What should I do??
14 September 2018 13:12
I figure out why doesn't not working my cases now. I tried to turn on Environment light of the world texture.
But I'm very Strange. Why the section have to turn on?
If that trigger box enabled My scene is the terrible performance. (My scene flame late is 2~3fps)
I want to access Texture object without turn on that section.

I know node with bake to cube-map in the material.
should I use that? I am not using this node

Please tell me. Thank you!
14 September 2018 18:46
Do you want to use a Cycles environment texture or a Blender Internal environment texture ("skybox")?



I tried to turn on Environment light
You don't have to turn on "Environment Lighting" to replace your texture. Edit: If you use a Cycles texture, that is. Cycles seems to be OK. But I'm getting your error too if I use a Blender Internal environment texture without enabling Environment Lighting.
18 September 2018 04:43
Thank you for answering me.
I don't know how to identify Cycles or Blender Internal and there are going to changing the parameter on Blende4web(web).

How to identify kind of environment cube map textures?

My solution created from following this tutorial now.
I had completed to set up at 3:41( apply to Cubemap to Blend4web)
https://www.youtube.com/watch?v=ZjZRBfajApw

Finally, If I will use the "Use Nodes(Cycles)" option, I want to know How to use that.
18 September 2018 18:22
By the way, my frame rate did not go down at all from using Blender Internal environment textures with Environment Lighting turned on. Maybe your image file is very large or your device slow. Depending on what you want to get out of using the texture, you can limit its influence (Sky Texture Usage: SKYDOME / ENVIRONMENT LIGHTING / BOTH in the texture tab->world textures property tab).
18 September 2018 18:25
Finally, If I will use the "Use Nodes(Cycles)" option, I want to know How to use that.
OK, I'll explain how to insert a Cycles Environment texture from the Start-Up Scene (Cube, Lamp, Camera). You should then have no problem repeating this for your own scene. Remember that Cycles background textures are NODE materials and have their own "strength" value which you CANNOT "turn off" (strength must be greater than zero or else your background will be black) - so maybe your framerate will still go down. Also, image files for these nodes must be standard/equirectangular images, not cubemap images.

Get your texture loaded:

1. You must be in Blend4Web Mode! [A]
2. Click on the World Tab. [B.]
3. Activate checkbox "Render Sky". [C]
4. Activate checkbox "Use Nodes (Cycles)" right below it. [D]


5. Switch to Cycles Mode. [A]
6. Open a Node Editor window (Shift+F3) [B.] and click on the Material icon [C] in the Node Editor window and then on the World icon to the right [D].
7. Make sure that the "Use Nodes" checkbox to the right is active [E]. You should now see a default node setup (Background+World Output) [F].


8. Add a node "Texture->Environment Texture" and plug the "Color" output into the Background node's "Color" input. [A]
9. Click "Open" (File) in the Environment Texture Node and load your image file. [B.]
10. The Environment Texture Node now contains your file. Now look at the name of the node: Its name should be "Environment Texture", but you can rename it if you want by bringing up the property panel (Key N) on the right. Remember this name because in step 12, you must use the name of this node to replace textures! [C]

Test if your texture is working:

11. Go back to Blend4Web mode and hit "Fast Preview". The browser opens with the Blend4Web Scene Viewer and the scene should show the cube with the background texture. If there is no background, you did something wrong.

OK, this is how you insert the texture. Do all these steps for your scene so that your scene shows the Cycles background texture.

Now for replacing the texture in your scene dynamically (during runtime):

12. Use the following code to replace the texture. This code example assumes that the name (mentioned in step 10) of your Environment Texture node is "Environment Texture". If you use a different name, insert that name.
function replace_my_environment_texture() {
  var _world = m_scs.get_world_by_name("World");
  var _image = new Image();
  _image.onload = function() {
    m_tex.replace_image(_world, "Environment Texture", _image, null); // the String is the name of the Cycles Env. Texture Node in Blender!
  }
  _image.src = "assets/my_new_background_texture.png"; // path and name of the image that is to replace the current background
}

Note: If you use this syntax, the new background image will only load upon calling this function. That means there will be a noticeable load time. If you want to avoid the latter, you have to pre-load the image, i.e. do the loading upon scene init, for example in the load function.
19 September 2018 07:13
Thank you to Teach to me how to use that
I don't try that yet sorry but I will try that at today

You are right. My CubeMap texture resolution is 4k.
How much is better IBL texture resolution?
I wanna use high resolutions.

Actually, I solved this problem but I don't understand why it has been solved.
I turn on Environment Lighting and I switched "Sky color" option.

I wanna ask you What different both approach?

Thank you :)
 
Please register or log in to leave a reply.