Update the texture dynamically based on user selection

Questions
,
1

Hi,

We have user interface where we show shirt and trouser textures and based on selection of textures we need to update the avatar(glb) dynamically.

if user clicks on Shirt design we need to update the texture in the glb file
let myTop = scene.getMeshByName(“Wolf3D_Outfit_Top.001”);
myTop.material.albedoTexture = myTexture;

If user clicks on trouser design we need to update the texture in the glb file
let mybottom = scene.getMeshByName(“Wolf3D_Outfit_Bottom.001”);
mybottom.material.albedoTexture = myTexture1;

The following is the code snippet, Can somebody suggest how to apply this feature ?

https://playground.babylonjs.com/#JHRF6T#25

Thanks
vijay

2

you could reuse the code from https://playground.babylonjs.com/#1BAPRM#73:

You could swap the content of onPointerDown by your own code taking care of swapping the shirts

3

Thanks sebavan…
In our case, we are displaying all shirt and trouser designs outside the babylon.js framework

Initially the user selects the design( example shirt ) and should apply the shirt texture.to the model. can we pass some parameter as part of Request object and identify the type of texture chosen and .apply the texture dynamically.

Just need some help how to handle this.

Thanks
vijay

4

https://playground.babylonjs.com/#G26RW3%2322

5

Have a look at this example - Mu-so 2nd Generation 3D
Buttons are HTML elements, which change texture on click event.

6

can u share the code for this…
technically i shud know how to code this

7

Just view the source in browser (press Ctrl+U in Chrome), it is open and really very simple :slight_smile:

2 Likes