Class PointerDragHelper

A helper class to handle pointer events and dispatch drag events: drag, dragStart and dragEnd with NDC coordinates and time.

To use, create an object of the class, set element with the HTML element(like canvas) and add event listeners to drag events.

Example

const pointerDragHelper = new PointerDragHelper()
pointerDragHelper.element = canvas
pointerDragHelper.addEventListener('dragStart', (e) => {
console.log('dragStart', e.pointer)
// {x: -0.5, y: 0.5, time: 123456789}
// x and y are NDC coordinates, time is the time when the event is fired.
// x and y are in the range of [-1, 1].
// x is left to right, y is bottom to top.
// time is in milliseconds.
})
pointerDragHelper.addEventListener('drag', (e) => {
console.log('drag', e.pointer)
// {x: -0.5, y: 0.5, time: 123456789}
})
pointerDragHelper.addEventListener('dragEnd', (e) => {
console.log('dragEnd', e.pointer)
// {x: -0.5, y: 0.5, time: 123456789}
})

Hierarchy

Implements

Constructors

Properties

_element?: HTMLElement
_pointer?: {
    time: number;
    x: number;
    y: number;
}

Type declaration

  • time: number
  • x: number
  • y: number
_pointerDown?: {
    time: number;
    x: number;
    y: number;
}

Type declaration

  • time: number
  • x: number
  • y: number
_pointerUp?: {
    time: number;
    x: number;
    y: number;
}

Type declaration

  • time: number
  • x: number
  • y: number

Accessors

Methods

  • Adds a listener to an event type.

    Parameters

    • type: "drag" | "dragStart" | "dragEnd"

      The type of event to listen to.

    • listener: ((event) => void)

      The function that gets called when the event is fired.

        • (event): void
        • Parameters

          • event: IEvent<"drag" | "dragStart" | "dragEnd">

          Returns void

    Returns void

  • Checks if listener is added to an event type.

    Parameters

    • type: "drag" | "dragStart" | "dragEnd"

      The type of event to listen to.

    • listener: ((event) => void)

      The function that gets called when the event is fired.

        • (event): void
        • Parameters

          • event: IEvent<"drag" | "dragStart" | "dragEnd">

          Returns void

    Returns boolean

  • Removes a listener from an event type.

    Parameters

    • type: "drag" | "dragStart" | "dragEnd"

      The type of the listener that gets removed.

    • listener: ((event) => void)

      The listener function that gets removed.

        • (event): void
        • Parameters

          • event: IEvent<"drag" | "dragStart" | "dragEnd">

          Returns void

    Returns void

Generated using TypeDoc