Wick Charts

useVisibleRange

useVisibleRange: (chart: ChartInstance) => VisibleRange

Subscribes to viewport changes. Returns the visible time range { start, end } of the chart. Use this to drive secondary visualisations (mini-maps, range-aware fetchers) that should track the user's pan/zoom.

Example

import { useEffect } from 'react';
import { useChartInstance, useVisibleRange } from '@wick-charts/react';
 
function RangeFetcher({ onRangeChange }: { onRangeChange: (start: number, end: number) => void }) {
  const chart = useChartInstance();
  const { start, end } = useVisibleRange(chart);
 
  useEffect(() => {
    onRangeChange(start, end);
  }, [start, end, onRangeChange]);
 
  return null;
}