ScreenSpaceZoomCameraController

A camera controller that allows zooming the camera in and out based on the pointer location in screen space.

new Cesium.ScreenSpaceZoomCameraController(options)

Creates a new instance of ScreenSpaceZoomCameraController.
Name Type Description
options ScreenSpaceZoomCameraController.ControllerOptions optional The options for configuring the controller.
Example:
viewer.scene.screenSpaceCameraController.enableInputs = false;
viewer.scene.screenSpaceCameraController.enableCollisionDetection = false;

const zoomCameraController = new Cesium.ScreenSpaceZoomCameraController();
viewer.addController(zoomCameraController);

Members

Enables or disables damping for zooming. Damping smooths out the camera movement and makes it feel more natural or weighty, but it can also introduce a slight delay in the camera response. If damping is disabled, the camera will respond immediately to user input.
Default Value: true
The drag input bindings that control zooming. Each binding is a combination of the mouse button and an optional keyboard modifier.
See:
Determines if the controller is enabled and should be updated by the host scene.
Enable or disable inertia when zooming. When enabled, the camera will continue to move after the user input stops, gradually slowing down based on ScreenSpaceZoomCameraController#inertialDecay.
Default Value: true
The rate at which the camera's zoom velocity decays over time.
Default Value: 6.0
Maximum distance from the zoom target that the camera can move away.
Default Value: 100000.0
The maximum zoom velocity in meters per second. This limits the speed at which the camera can zoom in and out.
Default Value: 1.0
A callback function used to pick the world position from which to zoom. The function is called with Scene, the Cartesian2 screen space position, and a Cartesian3 instance to store the result. The function should return the Cartesian3 world position from which to zoom, or undefined if no position could be picked.
Default Value: defaultPickWorldPosition
Example:
const zoomCameraController = new Cesium.ScreenSpaceZoomCameraController();
zoomCameraController.pickWorldPosition = function (scene, windowPosition, result) {
  // Pick the world position from the depth buffer
  return scene.pickPosition(windowPosition, result);
};
viewer.addController(zoomCameraController);
The scroll input bindings that control zooming.
Default Value: [ScreenSpaceEventType.WHEEL]
See:
If false, the camera will zoom to the position at the center of the screen. If true, the camera will zoom to the position under the cursor or tap when dragging starts or when scrolling with the scroll wheel.
Default Value: false
Specifies the length of time in seconds in which a single zoom animation is targeted to complete.
Default Value: 0.45
The ratio of the camera's distance to the zoom target that defines how much the camera zooms in and out per second.
Default Value: 0.4
The rate at which the camera zooms in and out based on the mouse wheel delta.
Default Value: 0.2

Methods

Invoked when the controller is added to the DOM. Implement connectedCallback to set up any DOM event listeners.
Name Type Description
element HTMLElement The DOM element containing the Cesium scene.

disconnectedCallback(element)

Invoked when the controller is removed from the DOM. Implement disconnectedCallback to tear down any DOM event listeners.
Name Type Description
element HTMLElement The DOM element containing the Cesium scene.
Invoked when the controller is being updated the first time, immediately before update is called. Implement firstUpdate to perform one-time work after the relevant scene has begun its render loop. Some examples might include initializing simulation time values or adding a primitive to the scene.
Name Type Description
scene Scene
time JulianDate The current simulation time.
See:
Invoked once per frame. Implement update to modify the camera or other parts of the scene.
Name Type Description
scene Scene
time JulianDate The current simulation time.
See:

Type Definitions

Cesium.ScreenSpaceZoomCameraController.ControllerOptions

Properties:
Name Type Attributes Description
dragInputs Array.<ScreenSpaceInputBindings.InputBinding> <optional>
The drag input bindings that control zooming.
scrollInputs Array.<ScreenSpaceEventType> <optional>
The scroll input bindings that control zooming.
Need help? The fastest way to get answers is from the community and team on the Cesium Forum.