terriajs/dist/ReactViews/Custom/Chart/ZoomX.js

Geospatial data visualization platform.

import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
import { select as d3Select } from "d3-selection";
import { zoom as d3Zoom } from "d3-zoom";
import { useEffect } from "react";
export const ZoomX = ({ surface, scaleExtent, translateExtent, initialScale, onZoom, children }) => {
    useEffect(() => {
        const zoom = d3Zoom()
            .scaleExtent(scaleExtent)
            .translateExtent(translateExtent)
            .on("zoom", (event) => {
            onZoom(event.transform.rescaleX(initialScale));
        });
        const selection = d3Select(surface);
        selection.call(zoom);
        return () => {
            selection.on(".zoom", null);
        };
    }, [initialScale, onZoom, scaleExtent, surface, translateExtent]);
    // eslint-disable-next-line react/jsx-no-useless-fragment
    return _jsx(_Fragment, { children: children });
};
ZoomX.displayName = "ZoomX";
export default ZoomX;
//# sourceMappingURL=ZoomX.js.map