@devgateway/dvz-ui-react/dist/cjs/embeddable/d3Map/BaseLayer.js

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.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const R=require("react/jsx-runtime"),x=require("react"),k=require("d3"),A=require("./Layer.js");function j(i){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const t in i)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(i,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>i[t]})}}return e.default=i,Object.freeze(e)}const f=j(k);class z extends A.default{constructor(){super(),this.gRef=x.createRef()}createPaths(e){const{path:t,fillColor:s,borderColor:o,projection:l}=this.props;this.gRef&&this.gRef.current&&(this.g=f.select(this.gRef.current),this.g.attr("class","base-layer zoomable"),this.g.selectAll(".borders").remove(),this.g.selectAll(".feature-label").remove(),this.g.selectAll(".borders").data(e.features).enter().append("path").attr("fill",s).attr("stroke",o).attr("id","state-borders").attr("class","borders").attr("d",t).style("vector-effect","non-scaling-stroke"))}createLabels(e){const{path:t,labelFilter:s=[],labelSettings:o={},labelField:l,labelFontSize:h,labelColor:a,projection:u,initialPosition:d,minLabelZoomVisible:b}=this.props;if(this.gRef&&this.gRef.current){this.g=f.select(this.gRef.current);const n=u.scale(),c=this.props.transform?this.props.transform.k:d.k;this.g.selectAll(".feature-label").data(e.features.filter(r=>s.indexOf(r.properties[l])==-1)).enter().append("text").attr("class","feature-label").attr("font-size",r=>Math.max(.5,h/c)+"px").style("pointer-events","none").text(function(r){return r.properties[l]}).attr("color",a).attr("fill",a).attr("transform",function(r){const p=o[r.properties[l]+"_rotation"]||0,g=o[r.properties[l]+"_offsetX"]||0,m=o[r.properties[l]+"_offsetY"]||0,y=t.centroid(r)[0]+g/n,v=t.centroid(r)[1]+m/n;return"translate("+[y,v]+"),rotate("+(p||0)+")"}).attr("text-anchor","middle").attr("dominant-baseline","middle"),c<b?(console.log("remove layers"),this.g.selectAll(".feature-label").transition().style("display","none")):this.g.selectAll(".feature-label").style("display","")}}resize(){const{labelFontSize:e,minLabelZoomVisible:t=-1}=this.props,s=this.props.transform?this.props.transform.k:1;console.log("minLabelZoomVisible",t,s),s<t?(console.log("remove layers"),this.g.selectAll(".feature-label").transition().style("display","none")):this.g.selectAll(".feature-label").style("display",""),this.g.selectAll(".feature-label").attr("font-size",o=>Math.max(.5,e/s)+"px")}createLayer(e){this.createPaths(e),this.createLabels(e),this.props.onReady&&this.props.onReady()}componentDidMount(){super.componentDidMount()}componentDidUpdate(e,t,s){const{editing:o}=this.props;o&&this.create(),e.visible!=this.props.visible&&this.g.style("display",this.props.visible?"block":"none"),this.g&&this.resize()}render(){const{name:e,height:t,width:s}=this.props;return R.jsx("g",{ref:this.gRef})}}exports.default=z;