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}
})
Copy