Jump to content

Following a moving object with ArcRotateCamera


Recommended Posts


I'm having problems with the ArcRotateCamera following a moving object.

I decided to make an example in jsfiddle 

In the demo you can left mouse button click on the ground and the sphere will move towards that position. During the movement you should be able to rotate the camera with right mouse button, this doesn't work for some reason?


Now I know what you are thinking, why not make a playground example? Well I did but for some strange reason it works in the playground while using the same version of babylon.

The playground example


I might be abusing the camera.setTarget method but why does it work in the playground and not in jsfiddle?

Any other way that could achieve following the object with the ArcRotateCamera is much appreciated!




Link to comment
Share on other sites

PEP.js could probably be the issue, but I couldn't recreate it.


I noticed there is a difference in the way BABYLON renders the following two examples of code:

Example 1:

runRenderLoop(() => {

     var lerp = BABYLON.Vector3.Lerp(startPosition, endPosition, fracDistance);

     sphere.position = lerp;



Example 2:

runRenderLoop(() => {

     var lerp = BABYLON.Vector3.Lerp(startPosition, endPosition, fracDistance);

     sphere.position.x = lerp.x;

     sphere.position.y = lerp.y;

     sphere.position.z = lerp.z;



With the second code example the sphere object moves a lot faster. Why is that?

Check the difference between the two examples:

slow: example1

fast: example2


Link to comment
Share on other sites

After some searching I found the cause of problem 1:

In the playground you don't need to call scene.render(), so what I think happens in the playground is:

scene.render(); // called in the background
scene.render(); // called by you

This is the playground with your second scene.render() removed, and it behaves just like the jsfiddle scene:


To solve this, you can call camera.update(), which updates for user input, after camera.setTarget():


Your second problem happens because in the "fast" playground, the startPosition is a reference to the position vector of the sphere, so when you do sphere.x, you are changing the startPosition, because they refer to the same Vector3. To fix this, you can do this instead:

startPosition = sphere.position.clone();



Link to comment
Share on other sites

3 hours ago, MikeFrost said:

Bedankt Gijs for your great detailed answere! I understand now what I did wrong and the problem is solved :)

You're welcome, but problem 1 wasn't caused the way I thought it was, so I've edited my comment accordingly. The solution is unchanged though.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...