Rotate mesh material

Is it possible to get the mesh material and rotate the material in babylon? Thanks!

Sure is. It would however depend on what you mean by ā€˜rotate the materialā€™.
In the end, the way the material is projected on the mesh depends on your UVWs and projection mode.
Rather than ā€˜rotateā€™ for a material, what you are likely looking for is ā€˜angleā€™ and ā€˜offsetā€™ (again depending on your UVs and projection mode). Would you have a PG to share with a small explanation of how you want your material to ā€˜rotateā€™?

1 Like

Thank you @mawa , could you explain more about what you mean by UVWs and projection mode? Iā€™m do not understand what those means,

In this playground, I hope can rotate the dog material image, I open the inspector, but I do not see the ā€˜angleā€™ or ā€˜offsetā€™ as you mentioned? AnimationGroup demo | Babylon.js Playground (babylonjs.com)

Thanks!

In your PG, you open the Babylon inspector and select the texture for the dog image, and then you can play with the W angle parameter to see the image rotating.

3 Likes

Thank you @slin , that did work, I see the dog image rotate with changing the W angle in inspector.

But in my own project, I tried to do change the texture using W angle, nothing changed, do you have any idea about why the texture rotation do not change?


Hi @pigga

Did you use radians instead of degrees (0-360) for the angle value?

3 Likes

Well, aside from @slin answer which is a mistake that is often done when not acquainted to BJS values, this can also be precisely where the UVs and projection mode can kick in. A texture is not always projected the same. Eventually the W value can be U or V on another mesh with different UVWs. Eventually, it will not work at all because the texture is either repeated or then again because of the UVWs. Angle will still make the texture rotate on its UVW axis BUT according to how these are set on the mesh, so it will not necessarly rotate around the mesh the way you want. When this happens, you can eventually use ā€˜offsetā€™ and if nothing works, the only solution is to redo your UVs so that it matches the way you want to wrap your object and displace/rotate your texture around it.

2 Likes

Thank you @slin , I get the texture by scene.getTextureByUniqueID which gives me a baseTexture class which does not has wAng like what you have in playground, do you know how to deal with that?

Are you using typescript? Then you can cast BaseTexture to Texture.

2 Likes

That works, thank you!

I checked my project, for one material it works with the W angle rotation, but for the other one, I rotated all the texture related to that material, but it does not all rotate properly, could you tell me more about what you mean by ā€œoffsetā€?

Sure. Where ā€˜angleā€™ actually ā€˜rotatesā€™ the texture on its axis, ā€˜offsetā€™ moves it. It sets a new starting point for where your texture will start to apply/project on your mesh. You can use offset on the U or V axis (obviously you cannot set it for W, because a texture is 2D; The depth is depending on the projection mode). So using uOffset will move the start point of your texture basically horizontally, while vOffset will move it on the vertical axis. Though same as with rotation, it depends on how the UVs are set for the mesh. Still worth trying. If nothing of angle or offset works, you will have to modify the UVWs on your mesh and/or the projection mode.