Interaction handler for panning the scene, which is achieved by clicking and moving the scene.

For examples, head to the Pan Interaction documentation page.

Hierarchy

Constructors

  • Creates a new instance of the pan interaction handler.

    Parameters

    Returns PanInteraction

Properties

callbackMap: Map<"onPan", undefined | boolean | ((panning: {
    x: number;
    y: number;
}, event: MouseEvent) => void)>

Accessors

  • get containerInstance(): HTMLElement
  • Internal

    Returns HTMLElement

  • get currentOptions(): P
  • Returns P

  • get nvlInstance(): NVL
  • Internal

    Returns NVL

Methods

  • Internal

    Parameters

    • type: keyof HTMLElementEventMap
    • listener: ((event: Event) => void)
        • (event): void
        • Parameters

          • event: Event

          Returns void

    • Optionaloptions: boolean | AddEventListenerOptions

    Returns void

  • Internal

    Parameters

    • name: "onPan"
    • Rest...args: unknown[]

    Returns void

  • Removes the related 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

  • Internal

    Parameters

    • type: keyof HTMLElementEventMap
    • listener: ((event: Event) => void)
        • (event): void
        • Parameters

          • event: Event

          Returns void

    • Optionaloptions: boolean | EventListenerOptions

    Returns void

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

    Parameters

    • name: string

      The name of the event

    • callback: undefined | boolean | ((panning: {
          x: number;
          y: number;
      }, event: MouseEvent) => void)

      The callback to be called when the event is triggered

    Returns void

  • Updates which type of graph elements should hinder panning.

    Parameters

    • targets: ("node" | "relationship")[]

      The graph elements that should hinder panning

    • excludeNodeMargin: boolean

      If true, the node margin will not hinder panning By default, panning is hindered by nodes and relationships.

    Returns void

    import { NVL } from '@neo4j-nvl/base'
    import { PanInteraction } from '@neo4j-nvl/interaction-handlers'

    const nvl = new NVL(document.createElement('div'), [{ id: '0' }], [])
    const panInteraction = new PanInteraction(nvl)

    // Pan canvas even when dragging on nodes and relationships
    panInteraction.updateTargets([], true)