diff --git a/packages/core/src/ChartCanvas.tsx b/packages/core/src/ChartCanvas.tsx index 54dece503..64705a97e 100644 --- a/packages/core/src/ChartCanvas.tsx +++ b/packages/core/src/ChartCanvas.tsx @@ -323,7 +323,7 @@ export interface ChartCanvasProps { readonly xExtents: ((data: any[]) => [TXAxis, TXAxis]) | (((data: any[]) => TXAxis) | TXAxis)[]; readonly xScale: ScaleContinuousNumeric | ScaleTime; readonly zIndex?: number; - readonly zoomAnchor?: (options: IZoomAnchorOptions) => TXAxis; + readonly zoomAnchor?: (options: IZoomAnchorOptions) => TXAxis; readonly zoomMultiplier?: number; } diff --git a/packages/core/src/zoom/zoomBehavior.ts b/packages/core/src/zoom/zoomBehavior.ts index 41dfd956d..835ae0580 100644 --- a/packages/core/src/zoom/zoomBehavior.ts +++ b/packages/core/src/zoom/zoomBehavior.ts @@ -2,24 +2,33 @@ import { ScaleContinuousNumeric, ScaleTime } from "d3-scale"; import { getCurrentItem } from "../utils/ChartDataUtil"; import { last } from "../utils/index"; -export interface IZoomAnchorOptions { - readonly plotData: T[]; +export interface IZoomAnchorOptions { + readonly plotData: TData[]; readonly mouseXY: number[]; - readonly xAccessor: (data: T) => number | Date; + readonly xAccessor: (data: TData) => TXAxis; readonly xScale: ScaleContinuousNumeric | ScaleTime; } -export const mouseBasedZoomAnchor = ({ xScale, xAccessor, mouseXY, plotData }: IZoomAnchorOptions) => { +export const mouseBasedZoomAnchor = ( + options: IZoomAnchorOptions, +) => { + const { xScale, xAccessor, mouseXY, plotData } = options; const currentItem = getCurrentItem(xScale, xAccessor, mouseXY, plotData); return xAccessor(currentItem); }; -export const lastVisibleItemBasedZoomAnchor = ({ xAccessor, plotData }: IZoomAnchorOptions) => { +export const lastVisibleItemBasedZoomAnchor = ( + options: IZoomAnchorOptions, +) => { + const { xAccessor, plotData } = options; const lastItem = last(plotData); return xAccessor(lastItem); }; -export const rightDomainBasedZoomAnchor = ({ xScale }: IZoomAnchorOptions) => { +export const rightDomainBasedZoomAnchor = ( + options: IZoomAnchorOptions, +) => { + const { xScale } = options; const [, end] = xScale.domain(); return end; }; diff --git a/packages/stories/src/features/interaction/Interaction.tsx b/packages/stories/src/features/interaction/Interaction.tsx index 7a5559f6f..8abbc72fe 100644 --- a/packages/stories/src/features/interaction/Interaction.tsx +++ b/packages/stories/src/features/interaction/Interaction.tsx @@ -8,6 +8,7 @@ import { YAxis, withDeviceRatio, withSize, + IZoomAnchorOptions, } from "react-financial-charts"; import { IOHLCData, withOHLCData } from "../../data"; @@ -20,7 +21,7 @@ interface ChartProps { readonly height: number; readonly ratio: number; readonly width: number; - readonly zoomAnchor?: any; + readonly zoomAnchor?: (options: IZoomAnchorOptions) => number | Date; } class Interaction extends React.Component {