Interaction handler for zooming the canvas, which is achieved by:

  • Scrolling the mouse wheel on the canvas
  • Using trackpad pinch gestures (equivalent to Ctrl/Cmd + scroll)

For examples, head to the Zoom Interaction documentation page.

Hierarchy

Constructors

  • Creates a new instance of the zoom interaction handler.

    Parameters

    • nvl: NVL

      The NVL instance to attach the interaction handler to.

    • options: ZoomInteractionOptions = {}

      Options to customize the zoom interaction behavior.

    Returns ZoomInteraction

Accessors

  • get currentOptions(): P
  • Returns the current options of the interaction.

    Returns P

    The current options of the interaction.

Methods

  • Removes the relevant event listeners from the canvas.

    Returns void

  • Remove a callback for a given event of type.

    Parameters

    • name: string

      The name of the event.

    Returns void

  • Enables or disables global text selection during a drag or pan operation.

    Parameters

    • enable: boolean

      Whether to enable or disable global text selection.

    • OptionaleventFunction: ((this: HTMLElement, ev: MouseEvent) => void)

      The event function to be added/removed when text selection is disabled/enabled.

        • (this, ev): void
        • Parameters

          • this: HTMLElement
          • ev: MouseEvent

          Returns void

    Returns void

  • Add or update a callback for a given event of type.

    Parameters

    • name: string

      The name of the event.

    • callback:
          | undefined
          | boolean
          | ((zoomLevel: number, event: WheelEvent) => void)
          | ((zoomLevel: number, panX: number, panY: number, event: WheelEvent) => void)

      The callback to be called when the event is triggered.

    Returns void