Implement Zoom To Pointer

[MattFerraro]

The Camera Controller we use now is the default TrackballControls from Three.js, albeit wrapped by Threlte. But this does not implement the zoom-to-mouse behavior that is default on almost every major CAD program. We need to implement that behavior.

This will require diving deep into the TrackballControls code and rewriting parts of it. For inspiration on how to tackle the math, CameraControls has an implementation that feels mostly right, but it is limited in that it experiences gimbal lock at the north and south poles like OrbitControls.

If you can read the source code of TrackballControls and it makes sense to you, then you have all the skills you need to implement this.

[daef]

if someone were to fix this, this should probably be implemented in three.js

there are multiple issues concerning this (mrdoob/three.js#27399, mrdoob/three.js#27110, mrdoob/three.js#25977, ..) reading issues like mrdoob/three.js#26366 or mrdoob/three.js#18496 make me think that (trackball)controls are waiting for an overhaul anyways.

[MattFerraro]

Making this change and contributing it upstream to Threejs would be great and I'd support that. Maybe it goes without saying but I also do not want to wait until it gets accepted upstream before using the new controller in CADmium

[talkingtab]

I am new to this (3js, r3f, r3d) so I could be completely off base:

I have tried using OrbitControls, MapControls & Camera-controls in {3,r3d,r3f}. My sense is that controls are following use cases. In other words- if some different behavior is needed a new kind of control is developed. The resulting multiple variants is difficulty maintaining a common interface to controls, feature set, etc. This is a hard problem, especially if the use cases are not understood.

My thinking is to begin collect the use cases and then begin merging all cases into one common control. Perhaps a single unified control is not possible, but if not, do we understand why not?

Just for example, my use case is a leaflet.js/google maps like interface that allows someone to zoom into a data map (implemented at the top level by a treemap). Imagine zooming into from google maps world view, down to a street level, then a building level, then inside a changing into a 3d view of the room. Just zooming. It appears the functionality to achieve this is already there. Camera-Controls, LOD/Details, OrthographicCamera, Perspective Camera, zoomToCursor. The issue is the interoperability of the pieces.

Perhaps a later task is to address the conceptual model of cameras and controls. Can the same camera have two interchangeable lens? (Perspective and Orthogonal). Currently cameras are attached to scenes, and controls to cameras. But is that right conceptually?

[MattFerraro]

@talkingtab I think you making some good observations about some big questions, but CADmium is not in a position to try and re-invent anything about threejs or how it works. We need one scene with one camera with one set of controls and we should use a specific, unique camera controller that we develop to exactly match our use case

[MattFerraro]

Here is a starting point: #66