Jump to content

Flying camera


Recommended Posts

Hi, I have scene with 2 objects http://www.babylonjs-playground.com/#BXII#18 and ArcRotateCamera on it. I choose it as I need to rotate around object and it does it job good. Now I want to create animation that changes camera target to second (fly to it) and than orbit around it. Is it possible with ArcRotateCamera or I should chose another camera as the base?


Link to comment
Share on other sites

Hi guys.  Here's my version, with clickable actionManagers on both targets, and an invisible box being used as a moveable camera target.


You can turn OFF the visibility in line 20, or disable .showBoundingBox in line 21... to make the moving target completely invisible.

The '5000' in lines 40 and 50... indicate that it will take about 5 seconds for the interpolation animation to complete.

Interpolation is a calculation that divides a time and distance into "steps", so the engine can "travel" each step, approximately one step per frame.

Hope this helps.  Party on!  Ping me here... if you want more info about this playground.

PS:  There is a graphics "glitch" that happens as the invisiTarget crosses to new target (in my FireFox).  It happens when you accidentally click on the wrong sphere, and then click on the correct sphere... less than 5 seconds later.  The glitch is caused by the animation of the wrong click... finishing.  I'll think about a workaround for that.  We could TURN OFF the actionManager on the current target mesh... so it isn't clickable.  We would need to turn it ON again, when the invisiTarget changes position to a new target.

Link to comment
Share on other sites

Thx, cool.  @BangTao's idea of simply sliding the camera target along an axis... is good, too.  Unfortunately, it needs your mesh to always stay in the same positions.  Or at least, it probably needed to establish a "Lerp" (an interpolation) between current camera target, and wanted camera target, and then travel that path... which in this case... would be a Vector3-type lerp.

With the actionManagers, yeah, it's a little code-heavy, but it allows you to put the mesh anywhere.

Also, know that you can turn-off the context menu that pops-open over canvas upon RIGHT-click, and then use the right click to move the camera target.  THEN... you can reserve your left click... for doing even MORE  fun things to the mesh (such as drag-position, drag-rotate, and drag-scale).

All .getAbsolutePosition() can be changed to simply .position, too.  [test]

I wonder if the "pointy hand" comes-on when we use OnRightPickTrigger.  There's also OnLongPressTrigger.  hmm.  Anyway, all the triggers and actions are shown in the actionManager docs.  Have fun.

Link to comment
Share on other sites

:)  I edited my previous post... and mentioned Lerp... which stands for linear interpolation.  I think it is a function on the vector3 class.  You would need to establish a lerp... between current camera target position, and wanted new position... and then use your render loop to step-along that lerp path, likely using addToRef and addInPlace to keep moving the camera target, lerp-step after lerp-step.

The action manager, and BJS Animation classes... makes it all a bit easier.  But... you were on the correct track.  Cool.  We also have Bezier funcs that can be applied to lerps/animation.  They can do curved paths between two points.  Also ease-ins/outs.  I don't know if those things are available on ActionManager-made interpolations, but they are definitely available on Animation-class interpolations. 

An actionManager can easily start/stop BJS animations, and in more than one way.  In fact, I think it actually uses the BJS Animation class... to do its animations.  Plus... actionManagers can do nearly ANYTHING... via their ExecuteCodeAction.

ActionManagers can be put on Scene, too, not just on mesh.  Weird, huh?  They are amazing.  Deltakosh is a genius, both coding-wise and idea-wise, and he freely lets us use/steal his stuff.  Pretty good guy.  :)

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...