terriajs
Version:
Geospatial data visualization platform.
23 lines • 1.16 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { observer } from "mobx-react";
import { forwardRef, useImperativeHandle, useRef } from "react";
import LineChart from "./LineChart";
import MomentPointsChart from "./MomentPointsChart";
/**
* A line chart, where each data point is represented by a circle, and a line is
* drawn between each point.
*/
export const _LineAndPointChart = forwardRef(({ id, chartItem, scales, color, glyph }, ref) => {
const lineRef = useRef(null);
const pointRef = useRef(null);
useImperativeHandle(ref, () => ({
doZoom(scales) {
lineRef.current?.doZoom(scales);
pointRef.current?.doZoom(scales);
}
}), []);
return (_jsxs(_Fragment, { children: [_jsx(LineChart, { ref: lineRef, chartItem: chartItem, scales: scales, color: color, id: id + "-line" }), _jsx(MomentPointsChart, { ref: pointRef, id: id + "-point", chartItem: chartItem, scales: scales, glyph: glyph })] }));
});
_LineAndPointChart.displayName = "LineAndPointChart";
export default observer(_LineAndPointChart);
//# sourceMappingURL=LineAndPointChart.js.map