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

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2022 Naive Map
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2022 Naive Map
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,11 +1,11 @@
-# @naivemap/maplibre-gl-echarts-layer
-
-EChartsLayer ([@naivemap/maplibre-gl-echarts-layer](https://www.npmjs.com/package/@naivemap/maplibre-gl-echarts-layer)): Integrates Apache ECharts with MapLibre GL JS, specifically enabling the use of **Lines graphs** and **Scatter (bubble)** charts as a map layer. This allows for visualizing connections, paths, and point-based data with the rich styling capabilities of ECharts.
-
-[API References](https://www.naivemap.com/maplibre-gl-layers/api/echarts-layer/)
-
-## Install
-
-```bash
-pnpm add @naivemap/maplibre-gl-echarts-layer echarts
-```
+# @naivemap/maplibre-gl-echarts-layer
+
+EChartsLayer ([@naivemap/maplibre-gl-echarts-layer](https://www.npmjs.com/package/@naivemap/maplibre-gl-echarts-layer)): Integrates Apache ECharts with MapLibre GL JS, specifically enabling the use of **Lines graphs** and **Scatter (bubble)** charts as a map layer. This allows for visualizing connections, paths, and point-based data with the rich styling capabilities of ECharts.
+
+[API References](https://www.naivemap.com/maplibre-gl-layers/api/maplibre-gl-echarts-layer/)
+
+## Install
+
+```bash
+pnpm add @naivemap/maplibre-gl-echarts-layer echarts
+```

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";const t=require("@naivemap/echarts-layer-core"),o=require("@naivemap/map-gl-layer-adaptor");class s{id;type;renderingMode;_core;_adaptor;constructor(e,r){this.id=e,this.type="custom",this.renderingMode="2d",this._core=new t(r),this._adaptor=o.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)}}module.exports=s;

package/dist/index.d.ts

@@ -1,3 +1,6 @@
-import { default as EChartsLayer } from './EChartsLayer';
-export type { ECOption } from './EChartsLayer';
-export default EChartsLayer;
+export * from './maplibre-gl-echarts-layer/src/index'
+export {}
+import EChartsLayer from './maplibre-gl-echarts-layer/src/index'
+export default EChartsLayer
+export * from './maplibre-gl-echarts-layer/src/index'
+export {}

package/dist/index.js

@@ -1,158 +1,60 @@
-import { getCoordinateSystemDimensions as p, registerCoordinateSystem as m, init as l } from "echarts";
-function r(i, t) {
-  const x = o();
-  return r = function(e, _) {
-    return e = e - 224, x[e];
-  }, r(i, t);
-}
-function o() {
-  const i = ["render", "project", "2|1|0|3|4", "isMoving", "width", "_coordSystemName", "length", "AahOj", "_prepareECharts", "apply", "split", "(((.+)+)+)+$", "_container", "lat", "series", "pointToData", "291772lPDZXS", "GOsgX", "_mapOffset", "getCanvasContainer", "unproject", "qhkgu", "689079IRHymf", "resize", "get", "dIzPr", "_createLayerContainer", "height", "_ec", "_ecOption", "constructor", "sYjhy", "create", "temDW", "dispose", "lng", "19488352RZTPFo", "renderingMode", "toString", "7700120jwSfap", "removeChild", "style", "getCanvas", "AObut", "dimensions", "380055ZZhKbX", "jagNs", "JQxpV", "kbosd", "1806070sfIyDw", "search", "dataToPoint", "coordinateSystem", "onRemove", "div", "substring", "onAdd", "knxrt", "9846420jFGSOz", "setOption", "LfjDd", "parentNode", "type", "2FsNvYb", "_removeLayerContainer", "RYmSC", "_map", "random"];
-  return o = function() {
-    return i;
-  }, o();
-}
-const c = r;
-(function(i, t) {
-  const x = { _0x4ce361: 253, _0x3dedf7: 247, _0x5eb008: 270, _0x37281f: 280 }, e = r, _ = i();
-  for (; ; )
-    try {
-      if (-parseInt(e(276)) / 1 + parseInt(e(226)) / 2 * (parseInt(e(x._0x4ce361)) / 3) + parseInt(e(x._0x3dedf7)) / 4 + parseInt(e(x._0x5eb008)) / 5 + parseInt(e(289)) / 6 + parseInt(e(x._0x37281f)) / 7 + -parseInt(e(267)) / 8 === t) break;
-      _.push(_.shift());
-    } catch {
-      _.push(_.shift());
-    }
-})(o, 925641);
-const u = /* @__PURE__ */ function() {
-  let i = !0;
-  return function(t, x) {
-    const e = i ? function() {
-      const _ = r;
-      if (x) {
-        const n = x[_(240)](t, arguments);
-        return x = null, n;
-      }
-    } : function() {
-    };
-    return i = !1, e;
-  };
-}(), h = u(void 0, function() {
-  const i = { _0x29537a: 269, _0x58c935: 278, _0x1c7685: 261, _0xe28cc7: 281 }, t = r, x = { JQxpV: t(242) };
-  return h[t(i._0x29537a)]().search(x[t(i._0x58c935)])[t(i._0x29537a)]()[t(i._0x1c7685)](h)[t(i._0xe28cc7)](x.JQxpV);
-});
-h();
-const g = "maplibregl-echarts";
-class b {
+import t from "@naivemap/echarts-layer-core";
+import { createMapLibreLayerAdaptor as o } from "@naivemap/map-gl-layer-adaptor";
+class s {
   id;
-  [c(275)] = ["x", "y"];
-  [c(229)];
-  _mapOffset = [0, 0];
-  constructor(t, x) {
-    const e = c;
-    this.id = t, this[e(229)] = x;
-  }
-  [c(263)](t) {
-    const x = { _0x2bc2ed: 288 }, e = c, _ = { knxrt: function(n, s) {
-      return n === s;
-    }, YzlBK: e(283) };
-    t.eachSeries((n) => {
-      const s = e;
-      _[s(x._0x2bc2ed)](n[s(255)](_.YzlBK), this.id) && (n[s(283)] = new b(this.id, this[s(229)]));
+  /**
+   * @ignore
+   */
+  type;
+  /**
+   * @ignore
+   */
+  renderingMode;
+  _core;
+  _adaptor;
+  /**
+   * @param id - A unique layer id
+   * @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, {
+      id: e,
+      renderingMode: this.renderingMode
     });
   }
-  [c(282)](t) {
-    const x = { _0x5d94b4: 229, _0x21d0d5: 249, _0x4b510c: 238 }, e = c, _ = { AahOj: function(a, f) {
-      return a - f;
-    } }, n = this[e(x._0x5d94b4)][e(232)](t), s = this[e(x._0x21d0d5)];
-    return [_[e(x._0x4b510c)](n.x, s[0]), _.AahOj(n.y, s[1])];
-  }
-  [c(246)](t) {
-    const x = c, e = { yAZXc: function(s, a) {
-      return s + a;
-    }, aHVXM: function(s, a) {
-      return s + a;
-    } }, _ = this._mapOffset, n = this[x(229)][x(251)]([e.yAZXc(t[0], _[0]), e.aHVXM(t[1], _[1])]);
-    return [n[x(266)], n[x(244)]];
-  }
-}
-class O {
-  id;
-  [c(225)];
-  [c(268)];
-  _container;
-  [c(229)];
-  [c(259)];
-  [c(236)];
-  _ecOption;
-  constructor(t, x) {
-    const e = { _0x11b415: 256, _0x35bebc: 241, _0x2beb0a: 268, _0x46fbcd: 264 }, _ = c, n = { dIzPr: _(233), svGWO: "custom", temDW: function(f, d) {
-      return f + d;
-    }, AObut: function(f, d) {
-      return f + d;
-    } }, s = n[_(e._0x11b415)][_(e._0x35bebc)]("|");
-    let a = 0;
-    for (; ; ) {
-      switch (s[a++]) {
-        case "0":
-          this[_(e._0x2beb0a)] = "2d";
-          continue;
-        case "1":
-          this[_(225)] = n.svGWO;
-          continue;
-        case "2":
-          this.id = t;
-          continue;
-        case "3":
-          this._coordSystemName = n[_(e._0x46fbcd)](n[_(274)](g, "-"), Math[_(230)]()[_(269)](16)[_(286)](2));
-          continue;
-        case "4":
-          this._ecOption = x;
-          continue;
-      }
-      break;
-    }
-  }
-  [c(287)](t) {
-    const x = { _0x494f35: 229, _0x2a74fd: 236, _0x4c38c2: 236 }, e = c, _ = { LfjDd: function(n, s) {
-      return n(s);
-    }, GOsgX: function(n, s, a) {
-      return n(s, a);
-    } };
-    if (this[e(x._0x494f35)] = t, this[e(257)](), !_[e(291)](p, this[e(x._0x2a74fd)])) {
-      const n = new b(this[e(x._0x2a74fd)], this[e(x._0x494f35)]);
-      _[e(248)](m, this[e(x._0x4c38c2)], n);
-    }
-  }
-  [c(284)]() {
-    const t = { _0x2df32d: 265 }, x = c;
-    this._ec?.[x(t._0x2df32d)](), this[x(227)]();
-  }
-  setOption(t, x) {
-    this._ec?.setOption(t, x);
-  }
-  [c(231)]() {
-    const t = { _0x412dab: 257, _0x36df60: 259, _0x3a2f40: 252, _0x584cfe: 259, _0x3503e0: 229, _0x4f3fb8: 234, _0x53c7f3: 259, _0x1963b2: 259, _0x4bf6fb: 254, _0x340c63: 229, _0x27a5ef: 235, _0x345038: 273, _0x289605: 259 }, x = c, e = { qhkgu: function(_, n) {
-      return _(n);
-    } };
-    !this._container && this[x(t._0x412dab)](), this[x(t._0x36df60)] ? this[x(t._0x3503e0)][x(t._0x4f3fb8)]() ? this[x(t._0x53c7f3)].clear() : (this[x(t._0x1963b2)][x(t._0x4bf6fb)]({ width: this[x(t._0x340c63)][x(273)]()[x(t._0x27a5ef)], height: this[x(229)][x(t._0x345038)]().height }), this[x(t._0x289605)].setOption(this[x(260)])) : (this[x(259)] = e[x(t._0x3a2f40)](l, this._container), this._prepareECharts(), this[x(t._0x584cfe)][x(290)](this[x(260)]));
-  }
-  [c(239)]() {
-    const t = { _0x515dcc: 277, _0x49035a: 262, _0x3df600: 236 }, x = c, e = { jagNs: function(n, s) {
-      return n - s;
-    }, kbosd: function(n, s) {
-      return n >= s;
-    }, sYjhy: "coordinateSystem" }, _ = this[x(260)][x(245)];
-    if (_) for (let n = e[x(t._0x515dcc)](_[x(237)], 1); e[x(279)](n, 0); n--)
-      _[n][e[x(t._0x49035a)]] = this[x(t._0x3df600)];
-  }
-  [c(257)]() {
-    const t = { _0x591bf8: 229, _0x281234: 243, _0x2e77a2: 235, _0xda316: 273, _0x3a53b0: 272, _0x384d1e: 229, _0x3becc9: 258 }, x = c, e = { RYmSC: x(285) }, _ = this[x(t._0x591bf8)][x(250)]();
-    this[x(243)] = document.createElement(e[x(228)]), this[x(t._0x281234)][x(272)][x(t._0x2e77a2)] = this[x(229)][x(t._0xda316)]()[x(t._0x3a53b0)].width, this[x(243)].style[x(258)] = this[x(t._0x384d1e)].getCanvas()[x(272)][x(t._0x3becc9)], _.appendChild(this[x(243)]);
-  }
-  _removeLayerContainer() {
-    const t = { _0x17c978: 224, _0x144b9b: 271 }, x = c;
-    this._container && this[x(243)][x(t._0x17c978)]?.[x(t._0x144b9b)](this._container);
+  /**
+   * @ignore
+   */
+  onAdd(e, r) {
+    this._adaptor.onAdd(e, r);
+  }
+  /**
+   * @ignore
+   */
+  onRemove(e, r) {
+    this._adaptor.onRemove(e, r);
+  }
+  /**
+   * Updates the ECharts visualization with a new configuration.
+   * This is the primary method for dynamically changing the displayed data or styles.
+   *
+   * @param option - The new ECharts option object to apply.
+   * @param notMerge - If true, the new options will completely replace the existing ones.
+   *                   If false or undefined, the new options will be merged with the old ones.
+   *                   Defaults to `false`.
+   * @see https://echarts.apache.org/en/api.html#echartsInstance.setOption
+   */
+  setOption(e, r) {
+    this._core.setOption(e, r);
+  }
+  /**
+   * @ignore
+   */
+  render(e, r) {
+    this._adaptor.render(e, r);
   }
 }
 export {
-  O as default
+  s as default
 };

package/dist/{EChartsLayer.d.ts → maplibre-gl-echarts-layer/src/EChartsLayer.d.ts}

@@ -1,10 +1,5 @@
-import { ComposeOption, EffectScatterSeriesOption, LegendComponentOption, LinesSeriesOption, ScatterSeriesOption, TitleComponentOption, TooltipComponentOption } from 'echarts';
-import { default as maplibregl } from 'maplibre-gl';
-/**
- * A composite type for ECharts options used by the EChartsLayer.
- * It includes common components and series types like Lines and Scatter.
- */
-export type ECOption = ComposeOption<TitleComponentOption | TooltipComponentOption | LegendComponentOption | LinesSeriesOption | ScatterSeriesOption | EffectScatterSeriesOption>;
+import { ECOption } from '../../echarts-layer-core/src/index.ts';
+import { CustomLayerInterface, Map } from 'maplibre-gl';
 /**
  * A custom MapLibre GL JS layer that renders Apache ECharts visualizations.
  *
@@ -42,7 +37,7 @@ export type ECOption = ComposeOption<TitleComponentOption | TooltipComponentOpti
  * map.addLayer(layer);
  * ```
  */
-export default class EChartsLayer implements maplibregl.CustomLayerInterface {
+export default class EChartsLayer implements CustomLayerInterface {
     id: string;
     /**
      * @ignore
@@ -52,11 +47,8 @@ export default class EChartsLayer implements maplibregl.CustomLayerInterface {
      * @ignore
      */
     renderingMode?: '2d' | '3d' | undefined;
-    private _container;
-    private _map;
-    private _ec;
-    private _coordSystemName;
-    private _ecOption;
+    private _core;
+    private _adaptor;
     /**
      * @param id - A unique layer id
      * @param ecOption - The ECharts option object used to configure the visualization.
@@ -66,11 +58,11 @@ export default class EChartsLayer implements maplibregl.CustomLayerInterface {
     /**
      * @ignore
      */
-    onAdd(map: maplibregl.Map): void;
+    onAdd(map: Map, gl: WebGLRenderingContext): void;
     /**
      * @ignore
      */
-    onRemove(): void;
+    onRemove(map: Map, gl: WebGLRenderingContext): void;
     /**
      * Updates the ECharts visualization with a new configuration.
      * This is the primary method for dynamically changing the displayed data or styles.
@@ -85,17 +77,5 @@ export default class EChartsLayer implements maplibregl.CustomLayerInterface {
     /**
      * @ignore
      */
-    render(): void;
-    /**
-     * @ignore
-     */
-    private _prepareECharts;
-    /**
-     * @ignore
-     */
-    private _createLayerContainer;
-    /**
-     * @ignore
-     */
-    private _removeLayerContainer;
+    render(gl: WebGLRenderingContext, args: unknown): void;
 }

package/dist/maplibre-gl-echarts-layer/src/index.d.ts

@@ -0,0 +1,3 @@
+import { default as EChartsLayer } from './EChartsLayer';
+export type { ECOption } from '../../echarts-layer-core/src/index.ts';
+export default EChartsLayer;

package/package.json

@@ -1,14 +1,15 @@
 {
   "name": "@naivemap/maplibre-gl-echarts-layer",
-  "version": "0.1.0",
+  "version": "0.2.0-alpha.0",
   "description": "A MapLibre GL JS layer to integrate Apache ECharts' Lines and Scatter charts.",
-  "main": "./dist/index.umd.cjs",
+  "main": "./dist/index.cjs",
   "module": "./dist/index.js",
   "type": "module",
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
-      "require": "./dist/index.umd.cjs"
+      "require": "./dist/index.cjs"
     }
   },
   "files": [
@@ -27,6 +28,11 @@
   "publishConfig": {
     "access": "public"
   },
+  "sideEffects": false,
+  "dependencies": {
+    "@naivemap/map-gl-layer-adaptor": "0.1.0",
+    "@naivemap/echarts-layer-core": "0.1.0"
+  },
   "peerDependencies": {
     "echarts": "^5.0.0",
     "maplibre-gl": "^4.0.0 || ^5.0.0"

package/dist/index.umd.cjs

@@ -1 +0,0 @@
-(function(i,s){typeof exports=="object"&&typeof module<"u"?module.exports=s(require("echarts")):typeof define=="function"&&define.amd?define(["echarts"],s):(i=typeof globalThis<"u"?globalThis:i||self,i.EChartsLayer=s(i.echarts))})(this,function(i){"use strict";const s="maplibregl-echarts";class o{id;dimensions=["x","y"];_map;_mapOffset=[0,0];constructor(t,e){this.id=t,this._map=e}create(t){t.eachSeries(e=>{e.get("coordinateSystem")===this.id&&(e.coordinateSystem=new o(this.id,this._map))})}dataToPoint(t){const e=this._map.project(t),n=this._mapOffset;return[e.x-n[0],e.y-n[1]]}pointToData(t){const e=this._mapOffset,n=this._map.unproject([t[0]+e[0],t[1]+e[1]]);return[n.lng,n.lat]}}class a{id;type;renderingMode;_container;_map;_ec;_coordSystemName;_ecOption;constructor(t,e){this.id=t,this.type="custom",this.renderingMode="2d",this._coordSystemName=s+"-"+Math.random().toString(16).substring(2),this._ecOption=e}onAdd(t){if(this._map=t,this._createLayerContainer(),!i.getCoordinateSystemDimensions(this._coordSystemName)){const e=new o(this._coordSystemName,this._map);i.registerCoordinateSystem(this._coordSystemName,e)}}onRemove(){this._ec?.dispose(),this._removeLayerContainer()}setOption(t,e){this._ec?.setOption(t,e)}render(){this._container||this._createLayerContainer(),this._ec?this._map.isMoving()?this._ec.clear():(this._ec.resize({width:this._map.getCanvas().width,height:this._map.getCanvas().height}),this._ec.setOption(this._ecOption)):(this._ec=i.init(this._container),this._prepareECharts(),this._ec.setOption(this._ecOption))}_prepareECharts(){const t=this._ecOption.series;if(t)for(let e=t.length-1;e>=0;e--)t[e].coordinateSystem=this._coordSystemName}_createLayerContainer(){const t=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,t.appendChild(this._container)}_removeLayerContainer(){this._container&&this._container.parentNode?.removeChild(this._container)}}return a});