@naivemap/maplibre-gl-echarts-layer 0.2.0-alpha.1 → 0.2.0

package/dist/index.es.js

@@ -1,6 +1,111 @@
-import t from "@naivemap/echarts-layer-core";
-import { createMapLibreLayerAdaptor as o } from "@naivemap/map-gl-layer-adaptor";
-class s {
+import { getCoordinateSystemDimensions as s, registerCoordinateSystem as a, init as h } from "echarts";
+const c = "gl-layer-echarts";
+class n {
+  id;
+  dimensions = ["x", "y"];
+  _map;
+  _mapOffset = [0, 0];
+  constructor(e, t) {
+    this.id = e, this._map = t;
+  }
+  create(e) {
+    e.eachSeries((t) => {
+      t.get("coordinateSystem") === this.id && (t.coordinateSystem = new n(this.id, this._map));
+    });
+  }
+  dataToPoint(e) {
+    const t = this._map.project(e), i = this._mapOffset;
+    return [t.x - i[0], t.y - i[1]];
+  }
+  pointToData(e) {
+    const t = this._mapOffset, i = this._map.unproject([e[0] + t[0], e[1] + t[1]]);
+    return [i.lng, i.lat];
+  }
+}
+class d {
+  _container;
+  _map;
+  _ec;
+  _coordSystemName;
+  _ecOption;
+  constructor(e) {
+    this._coordSystemName = c + "-" + Math.random().toString(16).substring(2), this._ecOption = e;
+  }
+  onAdd(e) {
+    if (this._map = e, this._createLayerContainer(), !s(this._coordSystemName)) {
+      const t = new n(this._coordSystemName, this._map);
+      a(this._coordSystemName, t);
+    }
+  }
+  onRemove() {
+    this._ec?.dispose(), this._removeLayerContainer();
+  }
+  setOption(e, t) {
+    this._ecOption = e, this._ec?.setOption(e, t);
+  }
+  render() {
+    if (this._container || this._createLayerContainer(), !this._ec) {
+      this._ec = h(this._container), this._prepareECharts(), this._ec.setOption(this._ecOption);
+      return;
+    }
+    if (this._map.isMoving()) {
+      this._ec.clear();
+      return;
+    }
+    this._ec.resize({
+      width: this._map.getCanvas().width,
+      height: this._map.getCanvas().height
+    }), this._prepareECharts(), this._ec.setOption(this._ecOption);
+  }
+  _prepareECharts() {
+    const e = this._ecOption.series;
+    if (e)
+      for (let t = e.length - 1; t >= 0; t--)
+        e[t].coordinateSystem = this._coordSystemName;
+  }
+  _createLayerContainer() {
+    const e = this._map.getCanvasContainer();
+    this._container = document.createElement("div"), this._container.style.width = this._map.getCanvas().style.width, this._container.style.height = this._map.getCanvas().style.height, e.appendChild(this._container);
+  }
+  _removeLayerContainer() {
+    this._container && this._container.parentNode?.removeChild(this._container);
+  }
+}
+function _(r) {
+  if (Array.isArray(r))
+    return r;
+  const e = r?.defaultProjectionData?.mainMatrix;
+  if (e)
+    return e;
+  throw new Error("Unable to resolve projection matrix from render arguments.");
+}
+function p(r, e) {
+  let t;
+  return {
+    id: e.id,
+    type: "custom",
+    renderingMode: e.renderingMode ?? "2d",
+    onAdd(i, o) {
+      t = i, r.onAdd(i, o);
+    },
+    onRemove(i, o) {
+      r.onRemove(i, o), t = void 0;
+    },
+    render(i, o) {
+      if (!t)
+        throw new Error("Layer adaptor render invoked before onAdd.");
+      r.render({
+        map: t,
+        gl: i,
+        matrix: (e.resolveMatrix ?? _)(o),
+        rawArgs: o,
+        prepareStencilMask: e.prepareStencilMask ? () => e.prepareStencilMask(t) : void 0
+      });
+    }
+  };
+}
+const m = p;
+class g {
   id;
   /**
    * @ignore
@@ -17,8 +122,8 @@ class s {
    * @param ecOption - The ECharts option object used to configure the visualization.
    * @see https://echarts.apache.org/en/option.html
    */
-  constructor(e, r) {
-    this.id = e, this.type = "custom", this.renderingMode = "2d", this._core = new t(r), this._adaptor = o(this._core, {
+  constructor(e, t) {
+    this.id = e, this.type = "custom", this.renderingMode = "2d", this._core = new d(t), this._adaptor = m(this._core, {
       id: e,
       renderingMode: this.renderingMode
     });
@@ -26,14 +131,14 @@ class s {
   /**
    * @ignore
    */
-  onAdd(e, r) {
-    this._adaptor.onAdd(e, r);
+  onAdd(e, t) {
+    this._adaptor.onAdd(e, t);
   }
   /**
    * @ignore
    */
-  onRemove(e, r) {
-    this._adaptor.onRemove(e, r);
+  onRemove(e, t) {
+    this._adaptor.onRemove(e, t);
   }
   /**
    * Updates the ECharts visualization with a new configuration.
@@ -45,16 +150,16 @@ class s {
    *                   Defaults to `false`.
    * @see https://echarts.apache.org/en/api.html#echartsInstance.setOption
    */
-  setOption(e, r) {
-    this._core.setOption(e, r);
+  setOption(e, t) {
+    this._core.setOption(e, t);
   }
   /**
    * @ignore
    */
-  render(e, r) {
-    this._adaptor.render(e, r);
+  render(e, t) {
+    this._adaptor.render(e, t);
   }
 }
 export {
-  s as default
+  g as default
 };

package/dist/index.umd.js

@@ -1 +1 @@
-(function(t,a){typeof exports=="object"&&typeof module<"u"?module.exports=a(require("@naivemap/echarts-layer-core"),require("@naivemap/map-gl-layer-adaptor")):typeof define=="function"&&define.amd?define(["@naivemap/echarts-layer-core","@naivemap/map-gl-layer-adaptor"],a):(t=typeof globalThis<"u"?globalThis:t||self,t.EChartsLayer=a(t.EChartsLayerCore,t.mapGlLayerAdaptor))})(this,function(t,a){"use strict";class o{id;type;renderingMode;_core;_adaptor;constructor(e,r){this.id=e,this.type="custom",this.renderingMode="2d",this._core=new t(r),this._adaptor=a.createMapLibreLayerAdaptor(this._core,{id:e,renderingMode:this.renderingMode})}onAdd(e,r){this._adaptor.onAdd(e,r)}onRemove(e,r){this._adaptor.onRemove(e,r)}setOption(e,r){this._core.setOption(e,r)}render(e,r){this._adaptor.render(e,r)}}return o});
+(function(n,s){typeof exports=="object"&&typeof module<"u"?module.exports=s(require("echarts")):typeof define=="function"&&define.amd?define(["echarts"],s):(n=typeof globalThis<"u"?globalThis:n||self,n.EChartsLayer=s(n.echarts))})(this,function(n){"use strict";const s="gl-layer-echarts";class a{id;dimensions=["x","y"];_map;_mapOffset=[0,0];constructor(e,t){this.id=e,this._map=t}create(e){e.eachSeries(t=>{t.get("coordinateSystem")===this.id&&(t.coordinateSystem=new a(this.id,this._map))})}dataToPoint(e){const t=this._map.project(e),i=this._mapOffset;return[t.x-i[0],t.y-i[1]]}pointToData(e){const t=this._mapOffset,i=this._map.unproject([e[0]+t[0],e[1]+t[1]]);return[i.lng,i.lat]}}class h{_container;_map;_ec;_coordSystemName;_ecOption;constructor(e){this._coordSystemName=s+"-"+Math.random().toString(16).substring(2),this._ecOption=e}onAdd(e){if(this._map=e,this._createLayerContainer(),!n.getCoordinateSystemDimensions(this._coordSystemName)){const t=new a(this._coordSystemName,this._map);n.registerCoordinateSystem(this._coordSystemName,t)}}onRemove(){this._ec?.dispose(),this._removeLayerContainer()}setOption(e,t){this._ecOption=e,this._ec?.setOption(e,t)}render(){if(this._container||this._createLayerContainer(),!this._ec){this._ec=n.init(this._container),this._prepareECharts(),this._ec.setOption(this._ecOption);return}if(this._map.isMoving()){this._ec.clear();return}this._ec.resize({width:this._map.getCanvas().width,height:this._map.getCanvas().height}),this._prepareECharts(),this._ec.setOption(this._ecOption)}_prepareECharts(){const e=this._ecOption.series;if(e)for(let t=e.length-1;t>=0;t--)e[t].coordinateSystem=this._coordSystemName}_createLayerContainer(){const e=this._map.getCanvasContainer();this._container=document.createElement("div"),this._container.style.width=this._map.getCanvas().style.width,this._container.style.height=this._map.getCanvas().style.height,e.appendChild(this._container)}_removeLayerContainer(){this._container&&this._container.parentNode?.removeChild(this._container)}}function d(r){if(Array.isArray(r))return r;const e=r?.defaultProjectionData?.mainMatrix;if(e)return e;throw new Error("Unable to resolve projection matrix from render arguments.")}function c(r,e){let t;return{id:e.id,type:"custom",renderingMode:e.renderingMode??"2d",onAdd(i,o){t=i,r.onAdd(i,o)},onRemove(i,o){r.onRemove(i,o),t=void 0},render(i,o){if(!t)throw new Error("Layer adaptor render invoked before onAdd.");r.render({map:t,gl:i,matrix:(e.resolveMatrix??d)(o),rawArgs:o,prepareStencilMask:e.prepareStencilMask?()=>e.prepareStencilMask(t):void 0})}}}const p=c;class _{id;type;renderingMode;_core;_adaptor;constructor(e,t){this.id=e,this.type="custom",this.renderingMode="2d",this._core=new h(t),this._adaptor=p(this._core,{id:e,renderingMode:this.renderingMode})}onAdd(e,t){this._adaptor.onAdd(e,t)}onRemove(e,t){this._adaptor.onRemove(e,t)}setOption(e,t){this._core.setOption(e,t)}render(e,t){this._adaptor.render(e,t)}}return _});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@naivemap/maplibre-gl-echarts-layer",
-  "version": "0.2.0-alpha.1",
+  "version": "0.2.0",
   "description": "A MapLibre GL JS layer to integrate Apache ECharts' Lines and Scatter charts.",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",
@@ -30,8 +30,8 @@
   },
   "sideEffects": false,
   "dependencies": {
-    "@naivemap/echarts-layer-core": "0.2.0-alpha.0",
-    "@naivemap/map-gl-layer-adaptor": "0.2.0-alpha.0"
+    "@naivemap/echarts-layer-core": "0.2.0",
+    "@naivemap/map-gl-layer-adaptor": "0.2.0"
   },
   "peerDependencies": {
     "echarts": "^5.0.0",