react-plot
Version:
Library of React components to render SVG 2D plots.
56 lines • 2.82 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { Line } from '../components/Annotations/Line.js';
import { Rectangle } from '../components/Annotations/Rectangle.js';
import { usePlotControls, usePlotEvents, } from '../contexts/plotController/plotControllerContext.js';
import { useStartMoveEnd } from './useStartMoveEnd.js';
export function useAxisZoom(options = {}) {
const { controllerId, disabled, direction = 'horizontal', horizontalAxisId = 'x', verticalAxisId = 'y', color = 'red', rectangleStyle, lineStyle, } = options;
const axisId = direction === 'horizontal' ? horizontalAxisId : verticalAxisId;
const plotControls = usePlotControls(options);
const startMoveEnd = useStartMoveEnd({
controllerId,
disabled,
onEnd(_, start, end) {
const startCoord = start.clampedCoordinates[axisId];
const endCoord = end.clampedCoordinates[axisId];
if (startCoord === endCoord) {
return;
}
plotControls.setAxis(axisId, {
min: Math.min(startCoord, endCoord),
max: Math.max(startCoord, endCoord),
});
},
});
usePlotEvents({
onDoubleClick({ event: { button } }) {
if (button !== 0)
return;
plotControls.resetAxis(axisId);
},
}, options);
if (!startMoveEnd?.end) {
return { annotations: null };
}
const start = startMoveEnd.start.clampedCoordinates[axisId];
const end = startMoveEnd.end.clampedCoordinates[axisId];
const lineProps = {
color,
strokeWidth: '2',
style: lineStyle,
};
const rectangleProps = {
color,
fillOpacity: 0.2,
style: rectangleStyle,
};
let annotations;
if (direction === 'horizontal') {
annotations = (_jsxs(_Fragment, { children: [_jsx(Line, { xAxis: horizontalAxisId, yAxis: verticalAxisId, x1: start, x2: start, y1: "0", y2: "100%", ...lineProps }), _jsx(Rectangle, { xAxis: horizontalAxisId, yAxis: verticalAxisId, x1: start, x2: end, y1: "0", y2: "100%", ...rectangleProps }), _jsx(Line, { xAxis: horizontalAxisId, yAxis: verticalAxisId, x1: end, x2: end, y1: "0", y2: "100%", ...lineProps })] }));
}
else {
annotations = (_jsxs(_Fragment, { children: [_jsx(Line, { xAxis: horizontalAxisId, yAxis: verticalAxisId, x1: "0", x2: "100%", y1: start, y2: start, ...lineProps }), _jsx(Rectangle, { xAxis: horizontalAxisId, yAxis: verticalAxisId, x1: "0", x2: "100%", y1: start, y2: end, ...rectangleProps }), _jsx(Line, { xAxis: horizontalAxisId, yAxis: verticalAxisId, x1: "0", x2: "100%", y1: end, y2: end, ...lineProps })] }));
}
return { annotations };
}
//# sourceMappingURL=useAxisZoom.js.map