Moving the center of the ArcRotateCamera

Hello everybody. I am new here.

There is a simple playground - https://playground.babylonjs.com/#5PWC2D#9

The problem is that when we drag the shape with the right mouse button, the center of the camera stays in place.
How do you make the center of rotation move with the shapes?

Set the camera’s parent to the shape.

How to do it?

camera.parent = shape

Parenting works with camera as well as a mesh

Can also use ArcRotateCamera | Babylon.js Documentation

I did this, but nothing changed.
Maybe I’m doing something wrong. :disappointed_relieved:
Can you please demonstrate?

Sorry only on mobile until tomorrow. Try using camera.lockedTarget = shape

Take a look at this alteration of that playground
https://playground.babylonjs.com/#5PWC2D#24

After creating the sphere I call camera.setTarget(sphere).. In the original the target is set to camera.setTarget(BABYLON.Vector3.Zero()).

When ArcRotateCamera.setTarget is called with the vector (like above) the camera can pan away from that point with the right mouse button.

The functionality for moving the camera is added in the line below lil FYI
camera.attachControl(canvas, true);

does setting the camera target the sphere produce the effect you’re looking for?.

Shapes can no longer be moved with the right mouse button. This is not a solution for me :disappointed_relieved:

Shapes can no longer be moved with the right mouse button. This is not a solution for me

Whats your end goal maybe i can point you in the right direction

I need to be able to drag the shapes with the right button and the center of the camera always remains in the center of these shapes.

You would have to add drag behavior, like in this example: Babylon.js Playground Then you could add something in the pointer up/down events to look at the current mesh while the pointer is held down.

There’s also the class PointerDragBehavior that has some camera control stuff you can specify. You could check out some of the playground examples for that also.

Maybe something like this:

https://playground.babylonjs.com/#5PWC2D#29

No, friend, here the figures return to the center. It should not be.

Hi.
In your playground you dont drag meshes with right mouse button you drag camera position.
http://screenshot.su/show.php?img=67e242a799bc1817d98b97e7e7261987.jpg
http://screenshot.su/show.php?img=70fd728d57c7cedc20d3e2617cdf5717.jpg
Simple solution
1)add drag behaviour to your mesh

2)attach camera target to your mesh with camera.lockedTarget

Result https://playground.babylonjs.com/#YEZPVT#456

2 Likes

This is exactly what Kvas says. Only your camera is moved, not your objects. My example works correctly, because this camera refocuses according to the position of your objects.

With my example, if you move the object, the camera will refocus on the object being moved.

@Igorg599 it might be helpful if you can point us to any other app that has the behavior you are speaking of. I find it hard to imagine both the camera and the object moving in sync as you describe. I tend to want one or the other but not both at the same time. Take this example using ArcRotateCamera:
https://www.babylonjs-playground.com/#Z9VF08

I can move the object with the gizmo while camera is stationery, or I can move the camera using the zoom wheel or left mouse drag. Now imagine if while moving the object the camera also chases that movement, then my relative mouse positions would also move and the object would shoot off screen in a big weird chase. So I’m wondering what you have in mind exactly?

Anything like this? https://www.babylonjs-playground.com/#7CBW04#414