Set box's face texture to custom image

[royibernthal]

Hi, I'm new here, my name is Royi.

I'm loading a custom image (.png) using AssetManager, on complete I'm rendering a scene with a box.

I want one face of the box to display the custom image I loaded.

I experimented with Sprite but it seems to be completely restricted to 2D (by definition I guess), I was hoping for a thin 2D sprite I could rotate around the z axis as well.

Is there some option to set the texture of a polygon's face to an image? Otherwise, how do I achieve it?

 

[JohnK]

Hi and welcome. Have a read of this https://doc.babylonjs.com/tutorials/CreateBox_Per_Face_Textures_And_Colors

Hopefully it may be of help to you.

[royibernthal]

Thank you it was helpful.

In order to display the material with the defused texture only on one face I simply set in the faceUV array all values to new BABYLON.Vector4(0, 0, 0, 0) except for the face in which I wanted to display it.

Would that be the optimal way to go in your opinion? I'm simply playing with the code I see I'm not really sure what solution would make the most sense.

[JohnK]

You only need to set one face. Bit further down in document.

Imagine we want to set only the face 4.
Forget about the for{} loop, just initialize our faceUV array and set only faceUV[4] :

  var faceUV = new Array(6);
  faceUV[4] = new BABYLON.Vector4(0, 0, 1 / hSpriteNb, 1 / vSpriteNb);

Only two lines of code only and that's all : http://www.babylonjs-playground.com#1V3CAT# 25

[jerome]

As JohnK explained, setting one faceUV array element will only modify the related face.

As the default uv value is (0,0,1,1) for each face, this default value will be applied to the other faces. As you discovered it, if you set (0,0,0,0) to the other faces, the texture won't just be visible... at no perf cost : there's only one initial texture passed to the GPU.

In other terms, whatever you need to set just a part of an image to one or many faces or whatever you need to apply a full image to one or some faces, faceUV is the right tool and will behave at the exact the same cost than a simple texture setting on any other mesh that doesn't support this feature.

[royibernthal]

JohnK - Doing that will have the other faces set to default like jerome explained below, while I need them to be completely empty and only have a texture on one face.

jerome - I understand, thanks for the explanation.

 

Thank you both