module usePannedAndZoomedDomain.ts #

function usePannedAndZoomedDomain #

(domain: MaybeRef<Domain>, axis: MaybeRef<"x" | "y">,
axisIsReversed: MaybeRef<boolean>, ddvRef: Ref<any>, mouseState:
MaybeRef<MouseState>, enablePan: MaybeRef<...>, enableZoom:
MaybeRef<...>) => { ...; }

usePannedAndZoomedDomain returns a reactive domain based on the first argment, that adjusts based on pointer drag, multi-touch pinch on touchscreens, and mousewheel. For the most common charting cases you will want to call this twice, once for the X axis and once for Y

Parameters #

• domain Domain

  The source domain, usually from the source-data itself

• axis MaybeRef<"x" | "y">

  Only a single dimension is handled at a time, 'x' for horizontal, 'y' for vertical

• axisIsReversed MaybeRef<boolean>

  true for inverted axis

• ddvRef Ref<any>

  A ref to the DDV component, ddv holds the event listeners

• mouseState MouseState

  A a ref to DDV's mouseState

• enablePan MaybeRef<boolean>

  exists to support reactive enable/disable behavior, will also accept non-reactive booleans

• enableZoom MaybeRef<boolean>

  exists to support reactive enable/disable behavior, will also accept non-reactive booleans

Returns { isZooming: Ref<boolean>; isPanning: Ref<boolean>; adjustedDomain: ComputedRef<Domain>; } #