OrbitControl rotate itself even pan (drag) to everywhere

Questions
1

I want to do as the same this question Orbit object around changing axis.
Also like this OrbitControls still rotate on model origin even when pan

Exactly like this example. By the way I want to do “Fit” and “Zoom” like the example.

I spent 2 days for researching this. However all of questions that I visited that seem to be not resolve yet.
Please help me.
Thanks in advanced.
P/s: for easier supporting, here is my codepen

2

nobody helps me :frowning:

3

Hi!
Are you looking for something like that?

4

Dear sir,
I’m looking for some thing exactly like this Autodesk viewer
You do right click to drag the object to somewhere then you do left mouse (orbit) to rotate the object. It still rotates around itself.

5

Just out of curiousity, should we provide a ready-made solution to you?

6

Honestly, I’m not an expert in three.js, 3D.
So I appreciate any helps.

7

Our conversation goes a bit off-topic, but could you put more effort in researching the task and do something yourself? :slight_smile:

8

Yes, I could. I’d spent 3 days already. Honestly I’m stuck and no way so finally I came here for asking.

9

The problem is that no control class of three.js can do what you are looking for. Besides, OrbitControl would be a bad starting point since the control mechanism of the Autodesk viewer is more similar to TrackballControls. You can easily see that since it’s possible to move the camera over the poles (in some sense the camera gets flipped upside down). This is not possible with OrbitControl since it retains the original up vector of the camera.

Maybe you can achieve a similar effect by combining TrackballControls with DragControls like in this example. In any event, you definitely need some enhancements if you want an exact replication of the Autodesk viewer control.

2 Likes
10

Thanks for replying.
I’ll try TrackballControls instead.

11

Hey there, I’m trying to achieve the same behavior with TrackballControls you described @nxhoang! Any updates on your progress? @Mugen87 the example you linked is unfortunately no longer available. Do you have an updated link? Thanks to everyone :slight_smile:

12

Try it with this one: three.js webgl - draggable cubes

1 Like
14

Hey @Mugen87 Could you please provide some implementation reference to achieve this kind of control effect with Trackball and Drag Controls.

Let me know what I want to achieve, Let say I used orbital Controls and I have an 3d object inside my scene, I want that the 3d object should always act as a target for my orbital controls, like the camera should always rotate around that object no matter object is on the center of the scene or not, like even if I pan using right mouse click and when object is no more on the center of the scene, even then after clicking left mouse button the camera rotation should always around that 3d object.
So In simple words, I have a 3d object inside scene I should be able to pan and rotate the camera through orbital controls around that 3d object.

The below I am attaching a reference for what I want to achieve, try to move the bike model far from the center of the scene with mouse right click (panning) and then use mouse left click to rotate, so there you will be able to see that the camera still moving around bike model.
Here’s the reference for what I want to achieve: https://makeityours.royalenfield.com/configurator/classic-350

Thanks!