# ArcRotate camera zoomOn not working as expected

**URL:** <https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130>\
**Category:** Bugs\
**Created:** [February 12, 2023, 3:25pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130 "2023-02-12T15:25:10Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [February 12, 2023, 3:25pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/1 "2023-02-12T15:25:10Z")

</div>

Hello!

All started here:

> [@ArcRotateCamera zoomOn](https://forum.babylonjs.com/t/arcrotatecamera-zoomon/37715/2):
>
> cc @PolygonalSun, our camera expert!

Here is a repro:

> **[Babylon.js Playground](https://playground.babylonjs.com/#W3D1GK)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

```auto
   camera.zoomOn([sphere])

```

Expected result (smthg like this):

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/4/0/40534d2aa5a4da7979912448a22c2abb28facb1d.jpeg)

Result:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/f/8/f8a8c107c7ee5b952aa55f9ab0094e2aac94fd13.png)

Would you please check this guys?

Thank you!

R.

---

<div class="post-metadata">

**Author:** ![Pe443](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pe443/32/22675_2.png) [@Pe443](https://forum.babylonjs.com/u/Pe443)\
**Post date:** [February 13, 2023, 7:04am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/2 "2023-02-13T07:04:53Z")

</div>

If you insert scene.render() it works:

scene.render();  
camera.zoomOn([sphere])

it works. But I don’t know if this is the correct way ,

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [February 13, 2023, 10:06am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/3 "2023-02-13T10:06:58Z")

</div>

Hmm, I could be wrong but I believe since it’s the arcRotateCamera, you should set the target first. Else, there’s no target.

> **[Babylon.js Playground](https://playground.babylonjs.com/#W3D1GK%232)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

**Edit:** Just checked back and you can also use camera.target  
I believe both work, as long as the camera has intially a target (or setTarget).  
However, I also believe that (line 8 in your PG) also demonstrates that if setTarget is a vector, it doesn’t seem to accept to zoomOn a mesh??!! Weirdo, isn’t it? Or I might have missed something? 🤔

> **[Babylon.js Playground](https://playground.babylonjs.com/#W3D1GK%233)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

Making a last check, it could be related to the absence of boundingBox info when initially setting the target to a Vector3. It could be that zoomOn would just not be accounting this information when switching from vector to a mesh. But that’s only a guess. Worth checking it out may be (or may be not 😉)

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [February 13, 2023, 11:18am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/4 "2023-02-13T11:18:29Z")

</div>

Hey @mawa!

Thank you! 😉

> [@mawa](#):
>
> Hmm, I could be wrong but I believe since it’s the arcRotateCamera, you should set the target first. Else, there’s no target.

It was never a requirement to set a target to use zoomOn. The second thing here, zoomOn accepts multiple meshes and should change the camera’s values to have all of these meshes visible.

> [@mawa](#):
>
> Making a last check, it could be related to the absence of boundingBox info when initially setting the target to a Vector3

This made me think a bit and the result is:

> **[Babylon.js Playground](https://playground.babylonjs.com/#W3D1GK%234)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

If you put the zoomOn code in the onReadyObservable callback it works as expected even with multiple meshes.

However this was never the case. Maybe this is due some optimalizations of the scene, maybe the bounding box is not calculated just right after the mesh is added…

Have a look here and check the Agressive mode:

> **[Optimizing Your Scene | Babylon.js Documentation](https://doc.babylonjs.com/features/featuresDeepDive/scene/optimize_your_scene#performance-priority-modes)**
>
> Learn how to optimize your scene in Babylon.js.

On the other hand the scene should be in backward compatible mode by default but maybe there are issues in the code. Just guessing 🙂

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [February 13, 2023, 11:23am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/5 "2023-02-13T11:23:22Z")

</div>

Unfortunatelly I don’t have time now to play with this ☹ so I’ll humbly wait for the team’s response 🙂

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [February 13, 2023, 11:25am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/6 "2023-02-13T11:25:17Z")

</div>

> [@roland](#):
>
> It was never a requirement to set a target to use zoomOn

To be honest, I never used it but I believe you when you say it wasn’t.

> [@roland](#):
>
> If you put the zoomOn code in the onReadyObservable callback it works as expected even with multiple meshes.

Yes, makes sense from the pseudo-fix above calling scene.render().

> [@roland](#):
>
> the scene should be in backward compatible mode by default

Can’t agree more.

> [@roland](#):
>
> I’ll humbly wait for the team’s response

Yes, same for me. Hope it won’t take too long since you are using it. Meanwhile, have a great day 🕶

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [February 13, 2023, 1:16pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/7 "2023-02-13T13:16:56Z")

</div>

> [@mawa](#):
>
> Meanwhile, have a great day 🕶

You too buddy!

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [February 13, 2023, 3:31pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/8 "2023-02-13T15:31:09Z")

</div>

[https://playground.babylonjs.com/#W3D1GK#5](https://playground.babylonjs.com/#W3D1GK#5) you need the sphere world matrix to be ready I believe

@PolygonalSun can confirm it is the correct approach ?

---

<div class="post-metadata">

**Author:** ![Pe443](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pe443/32/22675_2.png) [@Pe443](https://forum.babylonjs.com/u/Pe443)\
**Post date:** [February 14, 2023, 9:19am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/9 "2023-02-14T09:19:57Z")

</div>

This all sound good, but I have also a prolbem with zoomOn when the camera looks not from the front but from a different angle.  
PG-Demo: [https://playground.babylonjs.com/#W3D1GK#7](https://playground.babylonjs.com/#W3D1GK#7)

It does not zoom out so that I see the whole box, what can I do here?

THX 😉

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [February 14, 2023, 9:53am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/10 "2023-02-14T09:53:12Z")

</div>

I guess what @roland was saying is that the function was doing all that…until it didn’t anymore.  
I can’t say because I haven’t used it before but I guess he can confirm. Can you?

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [February 14, 2023, 10:06am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/11 "2023-02-14T10:06:09Z")

</div>

@mawa @sebavan Yes, I can confirm, everything was cool until something was broken/changed somewhere in a minor version of BabylonJS 5.

However I’m now using @sebavan 's ‘hack’, I have a presentation this week so I need get it working somehow 😃

Thanks @sebavan… I’ve tried to force compute the boundingBox, didn’t think about the world matrix though.

EDIT: I am curious, why is the world matrix not computed just right after the mesh is added to the scene (anymore?).

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [February 14, 2023, 5:02pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/12 "2023-02-14T17:02:59Z")

</div>

A great question for @PolygonalSun if he can have a look ?

---

<div class="post-metadata">

**Author:** ![PolygonalSun](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/polygonalsun/32/2704_2.png) [@PolygonalSun](https://forum.babylonjs.com/u/PolygonalSun)\
**Post date:** [February 15, 2023, 11:15pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/13 "2023-02-15T23:15:35Z")

</div>

Hey, @roland,  
I can take a look and see what’s going on. I think that I might have an idea what’s going on.

---

<div class="post-metadata">

**Author:** ![PolygonalSun](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/polygonalsun/32/2704_2.png) [@PolygonalSun](https://forum.babylonjs.com/u/PolygonalSun)\
**Post date:** [February 16, 2023, 1:45am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/14 "2023-02-16T01:45:10Z")

</div>

Yeah, that matches up with what I’m seeing. Basically, in the example PG, there is a position change against just the x coordinate. While this will move the sphere and make it appear in the right spot, the world matrix hasn’t been updated with this information at the time of the zoomOn call. When zoomOn calls Mesh.MinMax, the boundingInfo is pulled and the world matrix used is whatever is in cache at the time. I’m not sure what caused the change in behavior but my proposed fix would be to force a `computeWorldMatrix` for all meshes used in the zoomOn `meshes` argument. Lemme verify it doesn’t have any unintended consequences and if we’re clear, I’ll create a PR with the change.

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [February 16, 2023, 10:08am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/15 "2023-02-16T10:08:51Z")

</div>

Guys!

@PolygonalSun @sebavan @mawa

I am bit confused now 🙂 I am on BJS 5.46 now and the things seems to be fixed, at least for me, my code works again the same.

EDIT: on 5.47 just right now and it works too

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [February 16, 2023, 10:25am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/16 "2023-02-16T10:25:39Z")

</div>

Well, I can only guess the fix must have somehow gone through ‘under the radar’.  
I just opened my latest PG and restored your original setTarget to a vector3 and it now zoomOn properly on sphere. So I believe this one is now ‘gone with the wind’ 🌬 😃  
Although, there seems to be still some sort of delay. If I zoomOn instantly (on scene building/render), it doesn’t work. If I do a timeout (or a new render) it works 🤔

> **[Babylon.js Playground](https://playground.babylonjs.com/#W3D1GK%239)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![carolhmj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/carolhmj/32/25918_2.png) [@carolhmj](https://forum.babylonjs.com/u/carolhmj)\
**Post date:** [February 28, 2023, 1:18pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/17 "2023-02-28T13:18:50Z")

</div>

@PolygonalSun just to double check, was the issue solved?

---

<div class="post-metadata">

**Author:** ![PolygonalSun](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/polygonalsun/32/2704_2.png) [@PolygonalSun](https://forum.babylonjs.com/u/PolygonalSun)\
**Post date:** [March 1, 2023, 11:27pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/18 "2023-03-01T23:27:23Z")

</div>

AFAIK, it’s working as intended. If I’m incorrect about this, feel free to ping me and let me know what is being seen.

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [March 2, 2023, 9:57am UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/19 "2023-03-02T09:57:58Z")

</div>

Last time I tried it was working just fine. @roland Can you confirm?

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [March 7, 2023, 2:26pm UTC](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130/20 "2023-03-07T14:26:09Z")

</div>

@mawa @PolygonalSun@carolhmj  
Hello!

As far as we expect to calculate the world matrix of the mesh before using `zoomOn` with that mesh than it’s OK.

[Next page](https://forum.babylonjs.com/t/arcrotate-camera-zoomon-not-working-as-expected/38130.md?page=2)
