Apple Trackpad and the Arc Rotating Camera

[UeliUeli]

Dear Forum

I am working on an Apple / Mac computer and i can't get the apple trackpad on my Laptop to work with babylonjs (with pep.js) arc rotaing camera (or any other camera in that sense). Is there a documentation or examples on how to get input of apples trackpad?

Thanks!

[Yazheirx]

Have you tried using a normal mouse?  I exclusively use an  Apple Track Pad and an ArcRotate caméra for my current project. I had some trouble until I used the correct constructor. 

You could also check the Playgrounds for ArcRotate an see if any of them work with your track pad... then “borrow” their constructor. 

[UeliUeli]

With a normal mouse it's working, but just not with the Trackpad. Sadly so far i didn't see any Playground working with my Trackpad. What's the correct contructor? 

 

[Yazheirx]

If the solution is working with a standard mouse and none of the playgrounds are working for you then it is not the constructor.

I would assume it is how the trackpad drivers are interacting with the browser.  I don't think I can be of much help there.  Hopefully, some of the more senior members of this forum will be able to assist in that direction.

However, I have two more things that I would check:

1. Try a different browser (if you are testing in Safari try in Chrome)
2. Have a co-worker with a trackpad try to use the same application (this would be to check for company policies configuring the driver oddly)

[UeliUeli]

Dear Forum

I'm still struggling with touch control over the ArcRotatingCamera.

Pinch Zoom: Works on the iphone, as well as on the Trackpad (touchpad) of my computer, but: It is very slow on the Trackpad . If i change the "camera.pinchDeltaPercentage" value, the pinch speed changes on the iphone, but not on the computer.

Touch panning: Is not working on the iphone, not on the trackpad of my computer

 

I'm sorry if i miss the obvious, but I'm getting a little desperate.

 

Does somebody knows a playground example where panning with two fingers is working?

 

Thanks & all the best,

 

Quote

                        /// ARC ROTATE CAMERA

                                // Parameters: alpha, beta, radius, target position, scene
                                var camera = new BABYLON.ArcRotateCamera("camera", 0, 0, 5, new BABYLON.Vector3.Zero, scene);

                                // Positions the camera overwriting alpha, beta, radius  (LeftOrRight,UpOrDown,ForwardOrBackward))
                                camera.setPosition(new BABYLON.Vector3(-1300,0,2700));

                                //set target
                                camera.setTarget(BABYLON.Vector3.Zero());

                                // This attaches the camera to the canvas, prevent default and tels it what button is used for panning
                                camera.attachControl(canvas, false, true, 2);

                                //limit angle
                                camera.lowerBetaLimit = 0.1;
                                camera.upperBetaLimit = (Math.PI / 2) * 1.1;
                                camera.lowerRadiusLimit = 20;
                                camera.upperRadiusLimit = 4500;

                                //camera.inertia = 1;

                                //sensitivity

                                camera.pinchDeltaPercentage = 0.001;
                                //camera.inertialPanningX = 5;
                                //camera.pinchToPanMaxDistance = 10;
                                //camera.angularSensibilityX = 500;
                                //camera.angularSensibilityY = 5500;
                                //camera.panningSensibility = 10.0;
                                //camera.wheelPrecision = 0.8;
                                //camera.speed = 0.5;
                                //camera.pinchPrecision = 4;
                                //camera.pinchDeltaPercentage = 8.0;

                                //camera.panningInertia = 2;

                                scene.activeCamera = camera;

 

[kcoley]

@UeliUeli does this playground work for you? : https://www.babylonjs-playground.com/#12WBC#69

I just tested on my Apple trackpad.  I am using three fingers to pan and two fingers to zoom in.

[UeliUeli]

Hi Kcoley

 

The zooming works with two fingers up & down + pinch. But no panning with touch

 

[kcoley]

@UeliUeli I just remembered that I had enabled three finger drag on my Mac, which also enables three finger panning with the ArcRotateCamera.  You can enable this in System Preferences > Accessibility > Mouse & Trackpad > Trackpad Options.

Select "three finger drag" next to the "Enable dragging" dropdown and select the checkbox.

Afterwards, panning should work.

[UeliUeli]

that's a great tipp, thank you!! Now i can rotate it with three fingers.

 

But what i was looking for is a way to pan - on the arc rotating camera this would mean to move the target, right? Sorry if my english was not clear enough..

With this playground i am able to pan with two fingers on my mobile phone (iphone):

https://www.babylonjs-playground.com/#C2ZGCJ#1

Sadly it is not working on the trackpad (touchpad) of my computer.. Maybe i should try to make a custom input to the target of the arc rotating camera - i hope to find time to do that next week.

[UeliUeli]

 

• attachControl(element: HTMLElement, noPreventDefault?: boolean, useCtrlForPanning?: boolean, panningMouseButton?: number): void

• Overrides Camera.attachControl

  Attached controls to the current camera.

  Parameters

  • element: HTMLElement

    Defines the element the controls should be listened from

  • Optional noPreventDefault: boolean

    Defines whether event caught by the controls should call preventdefault() (https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault)

  • Optional useCtrlForPanning: boolean

    Defines whether ctrl is used for paning within the controls

  • Optional panningMouseButton: number

    Defines whether panning is allowed through mouse click button

     

    ---

     

    Question: what can i do with the last argument of camera.attachControl? Is there a number that defines two fingers swipes?

[UeliUeli]

Found out: 0 - LMB, 1 - MMB, 2 - RMB.

 

so: no options for touch panning...

 

[kcoley]

@UeliUeli it looks like panning works by holding down the control key while left-dragging, though this causes a context menu to pop up on Mac OS, which interferes with the pan.

 

I'll see if it is possible to make an update to support left-dragging with the command key for Mac OS