Universal Camera jumping around and not handling control very well

Questions
1

I’m trying to lock control of the camera and move around a map. I’ve been noticing some glitches in my personal project. From what I see, when I try to spin smoothly in a circle it’ll occasionally spin incredibly fast for a split second. As a test, I captured the cursor and then tried to look at each of the spheres in a circle at a steady pace. It seemed to change speeds randomly, even more than what I would expect from mouse acceleration (which I would hope is off)

In attempting to repro it in the playground, what I built there is much worse. It’s always much faster than I want and you can’t get your cursor back easily. I’m running this in Firefox.

I’m using two monitors, if that helps.

2

Commenting out: camera.inertia = 0.5
made things much smoother for me. It can’t be that easy though, is it?

3

I think that this helps (not necesarrily commenting it out, but setting the inertia to 0) but it isn’t fixing my problem.

Here’s another way to demonstrate. Capture the mouse and aim at a target. Place your other finger on the desk touching the side of your mouse, then move your mouse away then back to your finger. You would expect the camera to rotate away, then right back to the original target. In reality, the camera goes all over the place. A swipe will not act the same way every time.

4

Here’s something else I noticed, which is probably a Bug with the Playground

Go into the playground and remove lines 67-70. Restart the app. See that the pointer is still captured, even though the code to capture the cursor is gone.

I suspect if the event listener is not being properly cleared there might be unintended consequences.

5

Sometimes you have to close the browser and restart, I’ve noticed lingering bugs as well even though I fixed the code, a clean start is required sometimes

6

Here’s a video of me attempting to slowly, smoothly point the cursor back and forth between two points in the world. There’s some obvious stutter and some wild jumps. This was using a fresh Chrome browser.

7

Video marked as private, unable to view.

Sometimes the simplest solutions are the best, have you tried arcRotateCamera?

Hope that helps, works good on my end!

8

Oops, meant to be Unlisted. Fixed

9

I don’t think arcRotateCamera will work well for a first-person puzzle game.

12

Could it be the way you are requesting pointer lock? Maybe try it like this

I may not be helpful but at least your question gets a bump every time I reply haha

That async/await is what I’m looking at as the possible culprit…

2 Likes
13

Alright, here’s a partial fix.

In this article it shows how mouse acceleration messes up captured pointer data, and how to fix it. Unfortunately, the unadjustedMovement option is only partially compatible with modern browsers. Even so, I needed to use // @ts-ignore to stop an error from being called when calling requestPointerLock with an options object.

With all that, on Chrome my mouse movement is smooth with no jumps. Firefox still captures the cursor but doesn’t disable mouse acceleration.

2 Likes
15

Hey, with respect to lines 67-70, when you hit the Run button on the playground, it’s going to keep adding event listeners for click without clearing out the previous ones. This is because rerunning a script in the playground will only reset the status of the engine but not affect anything outside of that context unless explicit coded (ie. putting in code to clear out all click event listeners on the canvas). I’d recommend either using the canvas’ onclick callback or something like:

scene.onPointerObservable.add(async (evt) => {
    canvas.requestPointerLock();
}, BABYLON.PointerEventTypes.POINTERTAP);

You could also use the engine’s enterPointerlock() function to do the same thing. As far as the jumpy behavior, is there a reason why you chose 500 for angularSensibility (sensitivity?