How to use referentiel - 3 common examples

const longPressProps = useLongPress(ev => {
    if (!mapCanvasDimensions.current) {
      return;
    }

    let input = null;
    // ev can be a touch or click event
    if (ev.touches) {
      input = [ev.touches[0].pageX, ev.touches[0].pageY];
    } else {
      input = [ev.pageX, ev.pageY];
    }

    // calculate coordinates relative to the canvas
    const ref = new Referentiel(panZoomRef.current.getDragContainer());
    const [x, y] = ref.global_to_local(input);
    const { ratio } = mapCanvasDimensions.current;

    socket.emit("mark area", { x: x / ratio, y: y / ratio });
  }, 500);

pageCoordinates => {
      const ref = new Referentiel(panZoomRef.current.dragContainer.current);
      const [x, y] = ref.global_to_local([
        pageCoordinates.x,
        pageCoordinates.y
      ]);
      const { ratio } = mapCanvasDimensions;
      return { x: x / ratio, y: y / ratio };
    },
    [mapCanvasDimensions]

onStateChange={() => {
          panZoomReferentialRef.current = new Referentiel(
            panZoomRef.current.dragContainer.current
          );
        }}
        ref={panZoomRef}