Trying to add decal on avatar t-shirt

Hi all,

We are trying to add sticker on t-shirt front side using decal approach.
Using scene.pick method am trying to get coordinates on t-shirt front side but somehow am missing getting blank. can somebody suggest where am making mistake ?


The function where you’re printing the pickInfo doesn’t have pick information, it’s a predicate that controls which meshes should be tested for pick or not. If you want to get the picked point you can just use scene.onPointerDown: Pick | Babylon.js Playground (

1 Like

Should I understand that the sticker is always at the same place on the t-shirt? Or does it have to show where the user clicks?

In case #1, it’s not the best approach for this if you ask me. I’d rather consider the t-shirt branding as actually a part of the t-shirt. Where a decal (for me) is likely better used to create an overlay on a static (or temporary) object (i.e. a bullet impact). Which would also be case #2, is it?

For case #1 and to keep things simple and consistent, I would rather add it to your t-shirt. Either simply by replacing the texture or - in case the branding/logo needs to be detached from the t-shirt texture -, by cloning the front part mesh of the t-shirt only (the area that requires branding). Parent this clone to the t-shirt and offset it just the tiny-mini. Next, apply your branding on this cloned mesh (with an alpha/png).

For case #2, I believe the decal option would work (providing you implement the change from @carolhmj above to actually really pick your mesh coordinates :wink:)

Of course, my opinion only. Still, hope this helps,
Meanwhile, have a great day :sunglasses:

Thanks mawa for the inputs

i tried with yur case #2 option

there is no error but decal is not getting updated can u throw some light…

I can and I can’t :wink: At least, not just like that. I have never used decals before on moving objects.
What I can tell you is that there was already an error in your PG.
The mesh was not ready when creating the decal. You can avoid this with a promise or a scene.onReady observable.
I fixed this aspect somehow in this PG. From here, you can also see that the pickedInfo is dirty. It is because the mesh is animated.

So, from there I quickly went back to the ‘cat’ example from the doc. Added a rotation to the cat and as you can see a decal that is not parented to the cat remains offset from the mesh (which is kind of logical and obvious). To avoid this it appears that setParent would be the way to go.

The only thing I didn’t check is why the decal doesn’t seem to appear at all in your scene. There must be some error with the script, the size of the texture or something else. You should give it a new check based on the cat PG (which does work). Sry, I don’t really have more time to investigate and decals is clearly not my speciality.
Still, hope this helps and meanwhile, have a great day :sunglasses:

1 Like

Thanks mawa for yur efforts…

am just trying to modify the standard SSAOcat example,
seems at line 41 testDecal.pickedMesh is returning null.

am stuck

Sorry, I don’t know how to fix it. :cry: Told you decals and animated characters from blender are not my cup of tea. :tea: What I can say is that it must be something around the model. Either with how the axis and normals are set, with the influence of the skeleton, the transform nodes or with the rotation quartenion and eventually a combination of all.

I’m actually able to add the decals to the mesh. I can also set the parent. I can see the decal but it’s all offseted from the mesh and just the tiny-mini no matter the size of the decal. Also when I remove the mesh from the parent (set the parent to null) and re-initialize rotation and position, the mesh becomes like 10 times bigger and it’s orientation is weird (like the character is lying on the floor). Reason why I believe it must have something to do with the model.

So as I said, the rest is beyond my expertise. May be @labris @Blake or @PolygonalSun will be able to help here. I’m not sure who is a specialist for this kind of thing. Sry, all I can do. I hope you will get the answer soon. Meanwile, have a great day :sunglasses:

Hey @vijay_krishna,
So I’m looking through the code a bit and one of the first things that jumps out at me is that you’re checking for mesh === cat, where cat is the root node for your meshes. When you pick, it’ll check against any meshes on the screen. For example, if you click on the shirt, it’ll pick up the Wolf3D_Outfit_Top.001 mesh, which is not the same thing as your __root__. Because of this, your current predicate on line 63 will always be false. This prevents your boxes array from filling up and allowing testDecal.pickedMesh to be true.

You’ll have to modify your predicate to check if your picked mesh is one of the children of cat and then you might be able to reuse the picking info object generated by line 63 for decal placement.

1 Like

Thanks for helping. I actually figured this part but in fact there are other issues.
I guess the poster @vijay_krishna was getting inpatient :wink: and did a new post… and is now linked to this one that is currently taking care of by @Evgeni_Popov.

@vijay_krishna, you should mark this post as solved and please avoid posting twice for a same topic, if you don’t mind. Thanks and have a great day :sunglasses: