@joakimono/echarts-extension-leaflet/dist/echarts-extension-leaflet.js

Leaflet map extension for Apache Echarts 5

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("leaflet"),require("echarts/core")):"function"==typeof define&&define.amd?define(["leaflet","echarts/core"],t):"object"==typeof exports?exports.echartsExtensionLeaflet=t(require("leaflet"),require("echarts/core")):e.echartsExtensionLeaflet=t(e.L,e.echarts)}(self,((e,t)=>(()=>{"use strict";var n={167:t=>{t.exports=e},490:e=>{e.exports=t}},o={};function r(e){var t=o[e];if(void 0!==t)return t.exports;var i=o[e]={exports:{}};return n[e](i,i.exports,r),i.exports}var i=r(490);const a=i.version.split(".");let s={};var l=r(167);function c(e,t){return t=t||[0,0],i.util.map([0,1],(function(n){const o=t[n],r=e[n]/2,i=[],a=[];return i[n]=o-r,a[n]=o+r,i[1-n]=a[1-n]=t[1-n],Math.abs(this.dataToPoint(i)[n]-this.dataToPoint(a)[n])}),this)}const d=["echartsLayerInteractive","renderOnMoving","largeMode","layers"],f=l.Layer.extend({initialize:function(e){this._container=e},onAdd:function(e){e.getPane(this.options.pane).appendChild(this._container)},onRemove:function(e){l.DomUtil.remove(this._container)},_update:function(){}});function h(e,t){this._lmap=e,this._api=t,this._mapOffset=[0,0],this._projection=l.Projection.Mercator}const m=h.prototype;m.setZoom=function(e){this._zoom=e},m.setCenter=function(e){const t=this._projection.project(new l.LatLng(e[1],e[0]));this._center=[t.lng,t.lat]},m.setMapOffset=function(e){this._mapOffset=e},m.setLeaflet=function(e){this._lmap=e},m.getLeaflet=function(){return this._lmap},m.dataToPoint=function(e){const t=new l.LatLng(e[1],e[0]),n=this._lmap.latLngToLayerPoint(t),o=this._mapOffset;return[n.x-o[0],n.y-o[1]]},m.pointToData=function(e){const t=this._mapOffset,n=this._lmap.layerPointToLatLng({x:e[0]+t[0],y:e[1]+t[1]});return[n.lng,n.lat]},m.getViewRect=function(){const e=this._api;return new i.graphic.BoundingRect(0,0,e.getWidth(),e.getHeight())},m.getRoamTransform=function(){return i.matrix.create()},m.prepareCustoms=function(){const e=this.getViewRect();return{coordSys:{type:"lmap",x:e.x,y:e.y,width:e.width,height:e.height},api:{coord:i.util.bind(this.dataToPoint,this),size:i.util.bind(c,this)}}},m.convertToPixel=function(e,t,n){return this.dataToPoint(n)},m.convertFromPixel=function(e,t,n){return this.pointToData(n)},h.create=function(e,t){let n;return e.eachComponent("lmap",(function(e){if("undefined"==typeof L)throw new Error("Leaflet api is not loaded");if(n)throw new Error("Only one lmap echarts component is allowed");let o=e.getLeaflet();const r=e.get("echartsLayerInteractive");if(!o){const n=t.getDom();let r=t.getZr().painter.getViewportRoot();r.className="lmap-ec-layer";let a=n.querySelector(".ec-extension-leaflet");a&&(r.style.left="0px",r.style.top="0px",n.removeChild(a)),a=document.createElement("div"),a.className="ec-extension-leaflet",a.style.cssText="position:absolute;top:0;left:0;bottom:0;right:0;",n.appendChild(a);const s=i.util.clone(e.get());i.util.each(d,(function(e){delete s[e]})),o=new l.Map(a,s);let c=document.createElement("div");c.style="position: relative;",c.appendChild(r),new f(c).addTo(o),e.setLeaflet(o),e.setEChartsLayer(r)}e.__echartsLayerInteractive!==r&&(e.setEChartsLayerInteractive(r),e.__echartsLayerInteractive=r);const a=e.get("center"),s=e.get("zoom");if(a&&s){const t=o.getCenter(),n=o.getZoom();e.centerOrZoomChanged([t.lng,t.lat],n)&&o.setView(new l.LatLng(a[1],a[0]),s)}n=new h(o,t),n.setMapOffset(e.__mapOffset||[0,0]),n.setZoom(s),n.setCenter(a),e.coordinateSystem=n})),e.eachSeries((function(e){"lmap"===e.get("coordinateSystem")&&(e.coordinateSystem=n)})),n&&[n]},m.dimensions=h.dimensions=["lng","lat"],m.type="lmap";const p=h,u={type:"lmap",setLeaflet(e){this.__lmap=e},getLeaflet(){return this.__lmap},getId(){return this.__lmap._leaflet_id},setEChartsLayer(e){this.__echartsLayer=e},getEChartsLayer(){return this.__echartsLayer},setEChartsLayerVisibility(e){this.__echartsLayer.style.display=e?"block":"none"},setEChartsLayerInteractive(e){this.option.echartsLayerInteractive=!!e,this.__echartsLayer.style.pointerEvents=e?"auto":"none"},setCenterAndZoom(e,t){this.option.center=[e[1],e[0]],this.option.zoom=t},centerOrZoomChanged(e,t){const n=this.option;return o=e,r=n.center,!(o&&r&&o[0]===r[0]&&o[1]===r[1]&&t===n.zoom);var o,r},defaultOption:{center:[10.39506,63.43049],zoom:6,echartsLayerInteractive:!0,renderOnMoving:!0,largeMode:!1}},y=i.ComponentModel.extend(u),_={type:"lmap",init(){this._isFirstRender=!0},render(e,t,n){let o=!0;const r=e.getLeaflet(),a=n.getZr().painter.getViewportRoot().parentNode,s=e.coordinateSystem,l=r._mapPane,c=e.get("renderOnMoving"),d=e.get("resizeEnable"),f=e.get("largeMode");let h=function(t){if(o)return;let r=l.style.transform,i=0,c=0;if(r){r=r.replace("translate3d(","");let e=r.split(",");i=-parseInt(e[0],10),c=-parseInt(e[1],10)}else i=-parseInt(l.style.left,10),c=-parseInt(l.style.top,10);const d=[i,c],f=d[0]+"px",h=d[1]+"px";a.style.left!==f&&(a.style.left=f),a.style.top!==h&&(a.style.top=h),s.setMapOffset(e.__mapOffset=d),n.dispatchAction({type:"lmapRoam",animation:{duration:0}})};if(f&&(h=(0,i.throttle)(h,20,!0)),this._isFirstRender&&(this._moveHandler=h),this._ctrlStartHandler=function(e){"ControlLeft"===e.originalEvent.code&&r.dragging.disable()},this._ctrlEndHandler=function(e){"ControlLeft"===e.originalEvent.code&&r.dragging.enable()},r.off("move",this._moveHandler),r.off("moveend",this._moveHandler),r.off("zoom",this._moveHandler),r.off("viewreset",this._moveHandler),r.off("zoomend",this._moveHandler),r.off("keydown",this._ctrlStartHandler),r.off("keyup",this._ctrlEndHandler),this._ctrlStartHandler&&r.off("keydown",this._ctrlStartHandler),this._ctrlEndHandler&&r.off("keyup",this._ctrlEndHandler),this._resizeHandler&&r.off("resize",this._resizeHandler),this._moveStartHandler&&(r.off("move",this._moveStartHandler),r.off("zoomstart",this._moveStartHandler),r.off("zoom",this._moveStartHandler)),r.on(c?"move":"moveend",h),r.on(c?"zoom":"zoomend",h),c&&r.on("viewreset",h),!c&&!this._moveEndHandler){const t=function(t){setTimeout((function(){e.setEChartsLayerVisibility(!0)}),f?20:0)};this._moveEndHandler=t,r.on("moveend",t),r.on("zoomend",t)}if(this._ctrlStartHandler&&r.on("keydown",this._ctrlStartHandler),this._ctrlEndHandler&&r.on("keyup",this._ctrlEndHandler),this._moveHandler=h,!c){const t=function(){e.setEChartsLayerVisibility(!1),setTimeout((function(){e.setEChartsLayerVisibility(!0)}),500)};this._moveStartHandler=t,r.on("move",t),r.on("zoomstart",t),r.on("zoom",t)}if(d){let e=function(){(0,i.getInstanceByDom)(n.getDom()).resize()};f&&(e=(0,i.throttle)(e,20,!0)),this._resizeHandler=e,r.on("resize",e)}this._isFirstRender=o=!1},dispose(){s={};const e=this.__model;e&&(e.getLeaflet()&&(e.getLeaflet().off(),e.getLeaflet().remove()),e.setLeaflet(null),e.setEChartsLayer(null),e.coordinateSystem&&(e.coordinateSystem.setLeaflet(null),e.coordinateSystem=null),delete this._moveHandler,delete this._resizeHandler,delete this._moveStartHandler,delete this._moveEndHandler,delete this._ctrlEndHandler,delete this._ctrlStartHandler)}},g=i.ComponentView.extend(_);return(0,i.use)((function(e){5==a[0]&&a[1]<4&&e.registerLayout((function(e,t){e.eachSeriesByType("pie",(function(e){const t=e.coordinateSystem,n=e.getData(),o=n.mapDimension("value");if(t&&"lmap"===t.type){const r=e.get("center"),i=t.dataToPoint(r),a=i[0],s=i[1];n.each(o,(function(e,t){const o=n.getItemLayout(t);o.cx=a,o.cy=s}))}}))})),e.registerComponentModel(y),e.registerComponentView(g),e.registerCoordinateSystem("lmap",p),e.registerAction({type:"lmapRoam",event:"lmapRoam",update:"updateLayout"},(function(e,t){t.eachComponent("lmap",(function(e){const t=e.getLeaflet(),n=t.getCenter();e.setCenterAndZoom([n.lat,n.lng],t.getZoom())}))}))})),{}})()));