UNPKG

@devgateway/dvz-ui-react

Version:

A modular, embeddable React component library for data visualization and UI, built with TypeScript. Provides reusable components for charts, maps, dashboards, and more, with built-in support for internationalization and Redux integration.

52 lines (51 loc) 1.76 kB
import { jsx as l } from "react/jsx-runtime"; import n, { Children as h } from "react"; import * as p from "d3"; class f extends n.Component { constructor(t) { super(t), this.state = {}, this.divRef = n.createRef(), this.createProjection = this.createProjection.bind(this); } createProjection() { const { editing: t, height: o, width: e, scale: i = 200, center: r = [0, 0], projectionName: c } = this.props, s = p[c]().fitSize([e, o]).scale(i).center(r).translate([e / 2, o / 2]); return { path: p.geoPath().projection(s), projection: s }; } componentDidMount() { const { svg: t } = this.props, { path: o, projection: e } = this.createProjection(); this.setState({ path: o, projection: e }); } componentDidUpdate(t, o, e) { if (t.height !== this.props.height || t.width !== this.props.width || t.projectionName !== this.props.projectionName) { const { path: i, projection: r } = this.createProjection(); this.setState({ path: i, projection: r }); } } render() { const { editing: t, backgroundColor: o, height: e, width: i, scale: r = 190, center: c = [0, 0], initialPosition: s, settings: a } = this.props, d = h.toArray(this.props.children); return /* @__PURE__ */ l( "div", { className: "projected", width: i, height: e, style: { margin: "auto", backgroundColor: o, height: `${e}px`, width: `${i}px` }, children: h.map(d, (j) => n.cloneElement(j, { ...this.state, initialPosition: s, editing: t, height: e, width: i, settings: a, projection: this.state.projection })) } ); } } export { f as default };