Jump to content

How to create a trackball camera?


Hanesu
 Share

Recommended Posts

Hi there, I'm new here. First of all: Thank you to all of you guys contributing to Babylon.js, it's an amazing project! I'm using it mainly to set up interactive 3D visualizations for scientific purposes and it works like a charm!

Here's my question: So far I mainly use the ArcRotateCamera. There's nothing wrong with that camera, but the restriction that I cannot rotate over the 'north/South Pole' is something that bothers me, because it limits the exploration possibilities of the user. Further, although one can see the target from any position around it, one cannot see the target in all possible orientations. I would like a camera with trackball-like controls for the rotation around the target, meaning that in whichever position the camera is, I want to be able to rotate it around the two independent directions orthogonal to the line connecting target and camera position.

Is it possible to create such a behavior by customizing the UniversalCamera? Or if not, what would be the simplest way to implement such a camera?

Another idea would be to use a static camera and to attach custom mouse controls to rotate the target in the preferred way. But I don't know if this creates any drawbacks in terms of rendering performance. Does it?

Thanks a lot!

Link to comment
Share on other sites

On 5/26/2017 at 7:09 AM, Gijs said:

Hi, welcome to the forums!

I found that those limitations are controlled by camera.upperBetaLimit and camera.lowerBetaLimit, and setting them to either null or undefined disables them.

That's good to know, removing the BetaLimits feels already much better, it gives more freedom to the camera controls. But if one comes close to the poles the controls react a bit "nervous". More importantly, there are still many orientations of the target which are not accessible.

Link to comment
Share on other sites

On 5/26/2017 at 8:29 AM, brianzinn said:

This is a PG of the second way: I like this ArcRotateCamera trackball that iiceman made - maybe that will work, but it is wonky at the north/south poles:

http://www.babylonjs-playground.com/#4IVMG#2

Yeah, at the poles are the coordinate singularities where the nasty stuff is happening. This is why one needs to get into the guts of ArcRotateCamera to create a different behavior. I wonder if any other camera gives us the control over the transformation matrix.

Link to comment
Share on other sites

19 hours ago, Hanesu said:

That's good to know, removing the BetaLimits feels already much better, it gives more freedom to the camera controls. But if one comes close to the poles the controls react a bit "nervous". More importantly, there are still many orientations of the target which are not accessible.

Yes, I forgot to say that if beta <= 0, the rotation direction gets flipped (it's a feature). You can use this to "fix" it:

scene.registerBeforeRender(function(){
    if(camera.beta <= 0){
        camera.beta += Math.PI * 2;
    }
});

I also had an unsuccessful go at transforming ArcRotateCamera into a trackball camera, but it's definitely worth pursuing!

Regarding your second comment, you can override anything, so all cameras give you control over their transformation matrix. Here is a playground with ArcRotateCamera's _getViewMatrix function copied from the JavaScript code:

http://www.babylonjs-playground.com/#FTW19P

Link to comment
Share on other sites

Whooo, that "beta-fix" creates weird stuff that was not there before.

But thanks for the PG showing the override of the camera, I'll try my luck to implement a trackball version based on this.

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.

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

Loading...
 Share

  • Recently Browsing   0 members

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