Focus camera to a mesh

Can anyone help me on focusing a particular mesh ?
like I am changing hair here in the following PG by getting its mesh, but I am not able to change the camera focus on it.

Add to Camera:
camera1.useFramingBehavior = true ;

Then to your character:


@Dad72 Thank you for ur response.

But, I would like to make it as camera target to character on load,
and on click of hair image on it has to zoom and focus on that mesh

You can use zoomOn()-function of camera.

I commented what also caused issues in your PG:

Additionally you should consider what you do when the hair-button is clicked more than once, you might want to dispose the former hair.

1 Like

Yup. And also if you want to animate your character, you should parent the hair to the correct transformNode. Beyond that, I can only advise you start by removing the ‘_root_’ parent created from the import from Blender (or at least rename it). If you import a new hair mesh(es), you will have two and more of those, and I don’t even want to mention all issues that it will cause with animation, rotationQuartenion and the handling of the Camera.

Aside from that, I quickly did a rough example of how you could handle the import of these meshes and dispose of’em. Just very roughly done but incidentally, I was working on something similar just this morning.

As I said, very roughly done. Don’t know where you want to go with this: I.E. You could check on whether the hairstyle is already applied and then do nothing on pointer interaction. But then, I don’t know if your button is cycling through styles (in case you would just need to increment the ‘hairstyle’ variable on each click and load the new thumbnail in the button.

Well, I hope this can help anyways and meanwhile, have a great day :sunglasses:

1 Like

Thank u so much for your all responses,
Its working for me when click on hair image
I am like seperate methods for zoom out and seperate for importing mesh.

  • But now I am trying to zoom out when re-click on another image like on dress as mentioned in below PG, But it not working as expected.

  • And also while importing mesh of a dress, Its implementing in another pose, but not like the same as show in dress image (though the .glb file of dress is as idle pose only),

    • When I try to import the same .glb file of dress in babylon sandbox, its showing in Idle pose (Original pose)

This is because you are targeting to ‘hero.position’ but you declared that hero was the [0] from newMeshes (which is the infamous ‘_root _’ mesh). This mesh has a position of zero.
You have a number of solutions here. I will give you the one I think is appropriate. Admitting your characters are all humans (male, female, child) what I would do is target the hips and use a fixed radius for the camera. This way the camera will be at a fixed distance from the model and if you change the character you will also see his/her size change.

This is what I did here (roughly done, without an animation/transition):

But then of course, If your characters could be anything from an ant to a dinosaur, things would be different :wink: …In that case, you could use the framing behavior BUT you would first need to get the bounding box info of the imported character with all submeshes and you would use the center of this bounding box as a target and this bounding box for the framing.

There are also alternate solutions to this. I.E. Your imported model could come with an invisible bounding box. You would simply use this cube scaled to the size of your model to target and useFramingBehavior. And then, I’m sure others have even more ideas…

Sorry, I didn’t get it. The version I have in the PG seems to load on idle just fine. May be you could explain a bit more what the issue is?

Actually, the .glb of a dress is originally in other shape as shown in screenshot of previous reply. But While implementing it in mesh, it is implementing like without rigging

The implementation of dress glb should be like this: (Orginal shape present in .glb file of dress with rigging)

But it’s implementing like:

Oh, ok I understand. I thought it was the one in the PG.
Could you add it to the PG? Or just add the link or provide the glb so we can have a look at it?
It might not be me. Rigging and imported anim is not my speciality, but for whoever will check it out, we will need the asset or the PG because just the SS won’t do. Thx,

1 Like

Implementing of dress on click of image should be with rigging like shown in below PG:

But while I trying to implement on click of image is coming without rigging like:

Looks like you are adding a skeleton each time you click. As I said, not my cup of tea.
At this stage, may be @takemura or @cedric can help or find someone who will tell you what you should do.

I simplified a bit, so only one dress is loaded and parts are taken. Also it seems the animation on a mesh that’s parent or rig has changed stops animating, so after re-playing animationgroup of dress rig it gets into correct pose:


Here the PG:

I guess retarget animations or clone animationGroup are optimal options. Here are similar topics:


Thanks for taking care of this and sharing your invaluable expertise. :pray:
Have a great day :sunglasses:

Thank you so much for your responses @mawa and @Takemura

Here I had another issue, Could you please look into the below topic ?