Jump to content

FreeCamera Rotation Limit around X-Axis


Recommended Posts

Hey folks,


I am using a FreeCamera and want to be able to rotate all the way around the x-axis but the rotation always stops when I look straight down. I searched the forum and the web but I couldn't find a setting to disable that. Is that a technical limitation or is it somehow possible to create a workaround?


Not sure how useful a playground for that question is, but better to have on than not to ;) http://www.babylonjs-playground.com/#22PVJH


You start looking at a sphere, then look down, you will see another sphere and the ground. If you are there, you can't look down an further. I would like to be able to keep going. Like sitting in a spaceship with no real down. You know what I mean?

Link to comment
Share on other sites

Had a similar problem that DK helped with in this thread http://www.html5gamedevs.com/topic/17843-freecamera-oscillation-on-rotation-about-x-axis/


In the end I still had problems with with allowing full rotation around x axis if I then rotated around the world y axis which I never resolved so ended up limiting the rotation around x axis to -90 degs to 90 degs.


Hope this helps

Link to comment
Share on other sites

Thanks guys!


@John, I see, not sure if I could do it like that. But I might give it a try.


@Wingy, I am not sure if I understand what you did there and why it works, but somehow it seems to work! I'll try to understand it a bit better and maybe I can avoid the "roll" it seems to do. But it's definitely doing interesting movements and cam make you dizzy for sure... that's the kinds of spaceship feeling I had in mind ;)

Link to comment
Share on other sites

haha.  The main thing is... you didn't ask me to explain it.  Whew!  I dodged a bullet there, eh?  :D

That was all "feel it out", Iceman.  You can learn a bit more with a forum search for 'noRotationConstraint'.  In one of those threads, I did this:


Once you get the freeCamera attached to an object that has free gimbal movements (like a box)... you get more control.

(Temechon also did some work with non-restrained/non-constrained cameras, and I learned a bunch from that, but you'll need to find that thread yourself.  I think he was working-with ArcRotateCamera... and his work might have been the reason for ArcRotateCamera.allowUpsideDown setting.)

Speaking of http://playground.babylonjs.com/#22PVJH#1 again, there's the noRotationConstraint at line 7.  Nobody knows what it does, and it works via magic.  You can actually WISH IT into doing exactly what you need it to do.  heh.

And you know... line 22 moved the gizmo box to the same position as the active camera, so that the upcoming parenting wouldn't move the camera. 

Line 23 was a fudging (spray & pray) that set the camera orientation back to where it was before the parenting.  Line 22-24 can be executed in any order.

The final hell... line 29... I could see that mouse-dragging the freeCamera was producing good rotation v3's to the console.  So, I decided to "hotwire" those rotation numbers... onto gizmo/box.   This was done so that gizmo would react just like the freeCamera would, IF freeCamera was allowed to orient.  FreeCamera is NOT allowed to orient... because it has a parent... the camera gizmo box. 

In line 30 - the gizmo "commandeers" the camera's rotation numbers.

It was a leveraged buyout, a corporate power-grab, a true coup d'etat.  The new "board of direction" (a short 2 x 6 piece of wood bolted/glued to the bottom of the camera) was now calling the "shots" for the camera.  hehe.

Are you believing ANY of this, Ice Cream Man?  I didn't think so.  :)

Link to comment
Share on other sites

I think I understand what you did there. But not sure yet if it will work for my case :P


I definetly also need collisions checks... that seems to work a bit worse than without you cool hack: http://www.babylonjs-playground.com/#22PVJH#2


And after flying around for a while it seems that the camera direction is not the actual move direction anymore..if you know what I mean. I look in one direction. I push forward. But somehow I move sideways. Maybe you know why this happens... I didn't figure it out yet :(

Link to comment
Share on other sites

Oh sure, all of a sudden, you want to add a bunch of extra features like positioning and collisions, eh? 


Nobody said this was going to be difficult.  I must have missed that memo.  :)


Hey everyone, Iceman and JohnK have a nice campfire happening here.  Last time they threw a campfire party... it was a total good time, and we all learned a ton of stuff.


Gather 'round!  Let's see some more experiments.  Where else can you fly (camera) while intoxicated, and collisions don't hurt or cost?  :)


http://www.babylonjs-playground.com/#22PVJH#3  (Not worth bothering-with, a blatant Wingnut fail.) 


Yeah, we got issues.  :)   If the target of the camera/gizmo is aimed higher/lower than the horizon when the camera is turned, we get crooked. 


Yuh yuh yuh.  hmm.  This campfire (these playgrounds) is a nice place to gather and think about it, though.  Go on, poke a stick into the fire, stir the embers, hit RUN.  Find something "hot"?  Hit SAVE and then send us the new URL.

Link to comment
Share on other sites

Maybe...  https://github.com/BabylonJS/Babylon.js/search?q=noRotationConstraint


Also... http://doc.babylonjs.com/classes/2.2/FreeCamera 


Someone put all those red boxes at the top to remind us that freeCamera is an extension of targetCamera... which is easy to confuse with followCamera.  ;)


I believe targetCamera was invented during followCamera development, and a camera hierarchy wobble/shuffle was needed, which scared the dog. heh


I wonder what would happen using a Camera class?  I bet there are few constraints on that.

Link to comment
Share on other sites

Hmm.. I see... I didn't look there I guess :P


But ... why does only noRotationConstraint make the camera "bounce back" when looking down... is that really the intended behavior?


Maybe I can try to overwrite that _checkInputs function and see if I can come up with something that works for a bit better my case.

Link to comment
Share on other sites

Here's Temechon's quaternion thingy.  http://www.babylonjs-playground.com/#YRIPX#18


From this thread:  http://www.html5gamedevs.com/topic/14688-quaternion-arcrotatecamera/#entry83469


I needed to fix the cylinders.  The height subdivs param seems to be non-optional, lately.


It seems to be a pretty clean solve, but I didn't test it with collisions.  I don't understand how it works.  Nothing unusual there.  :)

Link to comment
Share on other sites

Thanks Wingman! Seems interesting but I don't understand it either... I think he just used a free camera to simulate a limitless arc rotate camera... I think you are right and this can be used to solve my problem... but I have no idea how :P

Link to comment
Share on other sites



I needed to fix the cylinders.  The height subdivs param seems to be non-optional, lately.

It seems that the question tag was omitted after subdivisions in the signature of CreateCylinder() when the port to MeshBuilder was done, so it breaks the retro-compat (subdivisions should keep optional)


And there was a weird treatment (that I can't remember) to check whether this parameter was really a subdivision one or a scene one

Link to comment
Share on other sites

Okay, new try, different approach: http://www.babylonjs-playground.com/#22PVJH#6


Seems pretty close already... I use 2 cameras, one ArcRotateCamera (camera2) without any rotation limitation, this is the camera the user sees, the user controls the rotation of this camera. I also create a second camera, a FreeCamera (camera1) and control it's position (including collisions) with the user input keys. I then set the FreeCameras position as the target for the ArcRotateCamera so that the ArcRotateCamera can move around (but keep its limit free rotation). That looks kinda good, I can't seem to make the FreeCamera move in the right direction. I would like to rotate it according to the current rotation of the ArcRotateCamera.


Might that work? It seemed possible in my head... where could it go wrong?

Link to comment
Share on other sites

Not sure if this is a way of thinking about your problem or not but it was something I thought about and then when I tried to do it in BJS got the same sort of problems you are encountering.


Here are some images of a spherical space ship. The blue triangle represents the window to the universe.

post-14282-0-40300700-1446034254.jpg  post-14282-0-70624600-1446034253.jpg


Imagine you are sat in the centre of the sphere with your head towards the top (ie the lightest part where the light blue and purple lines cross) and you are sat looking through the window (blue).


You want to change your view to target an object by rotating the spaceship to place the window in the red position.

You also want to see the view as you rotate.


Rotating with the window following along the white line (ie rotate about y axis and then x axis) or the green line ( small increment rotations about y axis and x axis) you finish with you view in the same orientation (ie your up and world up can be considered by you as the same).


Rotating with the window following along the light blue line (ie rotate about x axis and then y axis) or the purple line ( small increment rotations about x axis and then y axis) you finish with you view in the opposite orientation (ie see the world upside down). Rotating just around the y axis towards where the blue window was would make it now seem like the objects you were first viewing had turned themselves upside down.  You could stop this if when the window follows the light blue line or the purple line then within the space ship your gyroscopic chair was also rotating so that your up and the world up retained the same orientation.


Which is why in doing what I wanted I in the end restricted my rotations to the equivalent of the white lines.


it is a fascinating problem and I might have another go. Good luck iiceman.


Link to comment
Share on other sites

@ iiceman this PG may do what you want (or not) http://www.babylonjs-playground.com/#1U5Z73#5


I have used cones to show that your view goes upside down when you flip over the top or bottom. If the objects you are viewing are sphere this will be less noticeable. You start with red cones in front of you and blue cones behind you.


The camera is not attached to the canvas and I have used keys for movement rather than the mouse as it was easier for me. You can probably replace the keys with mouse movements but my brain has melted at the moment.


Left right arrow keys for rotation about y axis, up down arrow keys for x axis rotation.

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