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.

2 lines (1 loc) 2.33 kB
"use strict";const m=require("react/jsx-runtime"),R=require("react"),j=require("d3"),x=require("./Layer.js");function C(o){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const r in o)if(r!=="default"){const s=Object.getOwnPropertyDescriptor(o,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:()=>o[r]})}}return t.default=o,Object.freeze(t)}const d=C(j);class F extends x{constructor(){super(),this.gRef=R.createRef()}createPaths(t){const{path:r,fillColor:s,borderColor:l,projection:a}=this.props;this.gRef&&this.gRef.current&&(this.g=d.select(this.gRef.current),d.select(this.gRef.current.parentElement),this.g.attr("class","base-layer"),this.g.selectAll("path").remove(),this.g.selectAll(".label").remove(),this.g.selectAll("path").data(t.features).enter().append("path").attr("fill",s).attr("stroke",l).attr("id","state-borders").attr("d",r),this.props.transform&&this.g.attr("transform",this.props.transform))}createLabels(t){const{path:r,labelFilter:s=[],labelSettings:l={},labelField:a,labelFontSize:i,labelColor:n,projection:c}=this.props;if(this.gRef&&this.gRef.current){this.g=d.select(this.gRef.current);const h=this.props.transform?this.props.transform.k:1;this.g.selectAll(".label").data(t.features.filter(e=>s.indexOf(e.properties[a])==-1)).enter().append("text").attr("class","label").attr("font-size",e=>Math.min(i*1/h,i/2)+"px").text(function(e){return e.properties[a]}).attr("color",n).attr("fill",n).attr("transform",function(e){const f=l[e.properties[a]+"_rotation"]||0,p=l[e.properties[a]+"_offsetX"]||0,u=l[e.properties[a]+"_offsetY"]||0,b=r.centroid(e)[0]+p/c.scale(),g=r.centroid(e)[1]+u/c.scale();return"translate("+[b,g]+"),rotate("+(f||0)+")"}),this.props.transform&&this.g.attr("transform",this.props.transform)}}createLayer(t){this.createPaths(t),this.createLabels(t)}componentDidUpdate(t,r,s){const{name:l,file:a,path:i,transform:n,labelFilter:c=[],labelField:h,labelFontSize:e,labelColor:f,fillColor:p,borderColor:u,projection:b,update:g}=this.props;(a!==t.file||i!==t.path||b!==t.projection||n!==t.transform||c!==t.labelFilter||h!==t.labelField||e!==t.labelFontSize||f!==t.labelColor||p!==t.fillColor||u!==t.borderColor)&&this.create()}render(){const{name:t,height:r,width:s}=this.props;return m.jsx("g",{className:"base",ref:this.gRef})}}module.exports=F;