-
-
Notifications
You must be signed in to change notification settings - Fork 36.1k
Description
Related problem
Is your feature request related to a problem? Please describe.
We're working on a Sigma style editor for electrical engineering and PCB design. Navigating within a design by zooming is a big part of our application.
The current zoom controls always force the user to pan and then to zoom. This is a sub-optimal experience
Solution
Describe the solution you'd like
Zoom to cursor allows you to zoom a screen to the current position of the cursor. The movement is a combination of pan and zoom. The cursor stays during the entire operation at the same position and the scene zooms in around the objects of the cursor.
The behaviour is the same as it is implemented in Google Maps web interface in 3D view or Apple’s macOS Maps app in 3D view for zooming IN and OUT.
Describe alternatives you've considered
We have hacked the zoom to cursor in the OrthographicCamera and are looking to have a better version that also supports the PerspectiveCamera in the main repo.
You can find the solution in https://github.com/buildwithflux/three-orbitcontrols/blame/master/OrbitControls.js when looking. for the commit Zoom to cursor.
API spec proposal
There are different ideas on how the API interface for this functionality could look like.
Proposal 1
zoomToCursor: Bool - Requires enableZoom to be set to true as a prerequisite. When true, changes the zoom mode from the center of the scene to zooming to the cursor.
Proposal 2 - preferred
zoomMode: Enum { .center, .cursor } - Defines the zoom mode of the enableZoom flag. .center behaves like existing zoom functionality while .cursor allows for zooming to the cursor. Default: .center.
Personal opinion: I prefer proposal 2, as it will play nice with the “Zoom to objects” proposal and other future zoom functionality as well. Maintaining multiple booleans where the behavior is not clear defined is always messy.
Tasks
- Implement zoom to cursor in OrthographicCamera, initial implementation can be used as a starting point.
- Define with maintainers of this project how zoom to cursor in the PerspectiveCamera should behave.
- Implement zoom to cursor in PerspectiveCamera
- Add documentation: https://threejs.org/docs/#examples/en/controls/OrbitControls
References
Google Maps 3D view with zoom to cursor

Implementation plan
We aim to implement this feature ourselves. We're filing a GitHub issue to be able to communicate about the implementation details with the projects core maintainers.