ArcballControls target does not update when moving around

Hi there, I have looked at the following posts already to try to understand how to set the target of the ArcballControls:

  1. Camera rotation with ArcballControls
  2. In ArcballControls the target does not update its position - #2 by Mugen87

Have I understood correctly, that if I’d want to change what the ArcballControls are moving around I need to set the target? Because if I just move my ArcballControls around and check the target, the value stays the same. Also, the target field is not documented: three.js docs.

arcballControls.addEventListener("start", () => {
  console.log(`Current arcball target: ${Object(arcballControls).target.x}, ${Object(arcballControls).target.y}, ${Object(arcballControls).target.z}`)
});

I basically want to be able to set and read the target programmatically so I can reset the controls back to a custom starting point. Am I meant to use saveState() and reset() for this?

I was able to change the target: I created a typescript version of ArcballControls so I could expose and modify the target. Now I just need to set the target and call arcballControls.update().
This works for now but again, what is the right way to do this? Is modifying the target just a no go?

As far as I am concerned it looks like target is not really used for anything but the gizmo creation. And me calling update resolves the issue incidentally, since in there we do applyTransformMatrix using the internal this._gizmos.position.

1 Like

I’m not sure why it has a target field in the first place, except to make it easier to have both OrbitControls and ArcballControls in the same app, since OrbitControls Does use .target.. so that would be my guess is to just give the class a more similar shape to other controllers.
And yea.. it sounds like you figured out the best way for your case.

I think folks are used to JS ecosystem being all bells and whistles with parameter checking and such.. but that’s very much opposite to the design philosophy of threejs which is more like “the minimum amount of code to expose the underlying concept”, which is absolutely the right choice imo, and why threejs has become what it is.