@shjjs/visual-ui 1.0.0

package/es/components/scene-amap2d/index.vue2.mjs

@@ -0,0 +1,374 @@
+import { defineComponent as E, watch as d, openBlock as q, createElementBlock as K, normalizeClass as Q, unref as X, shallowRef as x, ref as g, onMounted as Y, onUnmounted as $, pushScopeId as ee, popScopeId as ae, createElementVNode as te } from "vue";
+import oe from "@amap/amap-jsapi-loader";
+import se from "axios";
+import { nanoid as le } from "nanoid";
+const re = (p) => (ee("data-v-0b1540a4"), p = p(), ae(), p), ne = /* @__PURE__ */ re(() => /* @__PURE__ */ te("div", {
+  id: "zerov-amap-2d",
+  class: "zerov-amap-container"
+}, null, -1)), ce = [
+  ne
+], ie = E({ name: "zv-scene-amap2d" }), ye = /* @__PURE__ */ E({
+  ...ie,
+  props: {
+    basicOption: {},
+    sources: {},
+    globalEvent: {},
+    uuid: {}
+  },
+  emits: [
+    "amap2d-scene-success",
+    "amap2d-scene-zoomstart",
+    "amap2d-scene-zoomend",
+    "amap2d-scene-mapclick",
+    "amap2d-scene-dragstart",
+    "amap2d-scene-dragging",
+    "amap2d-scene-dragend"
+  ],
+  setup(p, { expose: M, emit: A }) {
+    const o = p, u = A, B = () => {
+      const s = x(), n = x(), C = g(!1), m = g(), y = g(), f = g(), v = g(), S = (a) => {
+        k(), window._AMapSecurityConfig = {
+          securityJsCode: a.basic.securityJsCode
+        }, oe.load({
+          key: a.basic.key,
+          // 申请好的Web端开发者Key，首次调用 load 时必填
+          version: "2.0",
+          // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+          Loca: {
+            version: "2.0.0"
+          },
+          plugins: ["AMap.ControlBar", "AMap.ToolBar", "AMap.Scale", "AMap.HeatMap", "AMap.GeoJSON"]
+        }).then((e) => {
+          v.value = e, s.value = new e.Map("zerov-amap-2d", {
+            rotateEnable: a.config.rotateEnable,
+            // 是否开启地图旋转交互 鼠标右键 + 鼠标画圈移动 或 键盘Ctrl + 鼠标画圈移动
+            pitchEnable: a.config.pitchEnable,
+            // 是否开启地图倾斜交互 鼠标右键 + 鼠标上下移动或键盘Ctrl + 鼠标上下移动
+            resizeEnable: a.config.resizeEnable,
+            zoomEnable: a.config.zoomEnable,
+            dragEnable: a.config.dragEnable,
+            zoom: a.config.zoom,
+            // 初始化地图层级
+            viewMode: "2D",
+            // 开启3D视图,默认为关闭
+            zooms: a.config.zooms,
+            // 地图显示的缩放级别范围
+            center: a.config.center,
+            // 初始地图中心经纬度
+            mapStyle: a.config.mapStyle,
+            features: a.config.features
+          }), n.value = new window.Loca.Container({
+            map: s.value
+          }), f.value = new v.value.Scale({
+            visible: a.config.plugin.scale.visible,
+            position: {
+              left: a.config.plugin.scale.position.left + "px",
+              bottom: a.config.plugin.scale.position.bottom + "px"
+            }
+          }), s.value.addControl(f.value), m.value = new e.ControlBar({
+            visible: a.config.plugin.controlBar.visible,
+            showControlButton: a.config.plugin.controlBar.showControlButton,
+            position: {
+              right: a.config.plugin.controlBar.position.right + "px",
+              top: a.config.plugin.controlBar.position.top + "px"
+            }
+          }), s.value.addControl(m.value), y.value = new e.ToolBar({
+            visible: a.config.plugin.toolBar.visible,
+            position: {
+              left: a.config.plugin.toolBar.position.left + "px",
+              top: a.config.plugin.toolBar.position.top + "px"
+            }
+          }), s.value.addControl(y.value), z(e), s.value.on("complete", () => {
+            setTimeout(() => {
+              C.value = !0, u("amap2d-scene-success"), window.SHJParseEvent(o.globalEvent, "amap2d-scene-success", null);
+            }, 666);
+          }), s.value.on("zoomstart", () => {
+            u("amap2d-scene-zoomstart"), window.SHJParseEvent(o.globalEvent, "amap2d-scene-zoomstart", null);
+          }), s.value.on("zoomend", () => {
+            u("amap2d-scene-zoomend"), window.SHJParseEvent(o.globalEvent, "amap2d-scene-zoomend", null);
+          }), s.value.on("click", (t) => {
+            u("amap2d-scene-mapclick", t.lnglat), window.SHJParseEvent(o.globalEvent, "amap2d-scene-mapclick", t.lnglat);
+          }), s.value.on("dragstart", (t) => {
+            u("amap2d-scene-dragstart", t.lnglat), window.SHJParseEvent(o.globalEvent, "amap2d-scene-dragstart", t.lnglat);
+          }), s.value.on("dragend", (t) => {
+            u("amap2d-scene-dragend", t.lnglat), window.SHJParseEvent(o.globalEvent, "amap2d-scene-dragend", t.lnglat);
+          });
+        }).catch((e) => {
+        });
+      }, z = (a) => {
+        o.sources && o.sources.length > 0 ? window.SHJDatasourceV2({
+          tId: o.uuid,
+          sources: o.sources,
+          callback: (e) => {
+            try {
+              const t = o.basicOption.widgets.find((r) => r._sourceId === e.id);
+              t && t.type === "heatmap" && D(a, t, e.data[0].data), t && t.type === "dotlayers" && H(window.Loca, t, w(e.data[0].data)), t && t.type === "scatter" && N(window.Loca, t, w(e.data[0].data)), t && t.type === "labelsLayer" && F(window.Loca, t, w(e.data[0].data));
+            } catch {
+            }
+            o.basicOption.widgets.filter((t) => t.type === "boundary").forEach((t) => {
+              O(a, t);
+            });
+          }
+        }) : o.basicOption.widgets.filter((e) => e.type === "boundary").forEach((e) => {
+          O(a, e);
+        });
+      }, J = (a) => {
+        const t = a.slice(a.indexOf("(") + 1, a.lastIndexOf(")")).split(",").map((l) => l.trim()), r = {};
+        for (let l = 1; l < t.length; l++) {
+          const i = t[l].split(" "), c = i[0], V = parseFloat(i[1]) / 100, U = Math.round(V * 100) / 100;
+          r[U] = c;
+        }
+        return r;
+      }, D = (a, e, t) => {
+        try {
+          const r = new a.HeatMap(s.value, {
+            radius: e.radius,
+            // 给定半径
+            opacity: e.opacity,
+            gradient: J(e.gradient)
+          });
+          setTimeout(() => {
+            r.setDataSet({
+              data: t,
+              max: e.max
+            });
+          }, 0);
+        } catch {
+        }
+      }, O = async (a, e) => {
+        try {
+          const t = await se.get(e.geojson);
+          if (t.status === 200) {
+            const r = new a.GeoJSON({
+              geoJSON: t.data,
+              getPolygon: function(l, i) {
+                const c = new a.Polygon({
+                  path: i,
+                  zIndex: e.zIndex,
+                  fillColor: e.style.fillColor,
+                  // 填充色
+                  strokeOpacity: e.style.strokeOpacity,
+                  // 轮廓线透明度
+                  fillOpacity: e.style.fillOpacity,
+                  // 填充色透明度
+                  strokeColor: e.style.strokeColor,
+                  // 线条颜色
+                  strokeWeight: e.style.strokeWeight,
+                  // 线条宽度
+                  strokeStyle: e.style.strokeStyle
+                  // 线条样式
+                });
+                return c.on("mouseover", () => {
+                  c.setOptions({
+                    fillOpacity: e.mouseover.fillOpacity,
+                    fillColor: e.mouseover.fillColor,
+                    strokeOpacity: e.mouseover.strokeOpacity,
+                    strokeColor: e.mouseover.strokeColor,
+                    strokeStyle: e.mouseover.strokeStyle,
+                    strokeWeight: e.mouseover.strokeWeight
+                  });
+                }), c.on("mouseout", () => {
+                  c.setOptions({
+                    fillColor: e.style.fillColor,
+                    // 填充色
+                    strokeOpacity: e.style.strokeOpacity,
+                    // 轮廓线透明度
+                    fillOpacity: e.style.fillOpacity,
+                    // 填充色透明度
+                    strokeColor: e.style.strokeColor,
+                    // 线条颜色
+                    strokeWeight: e.style.strokeWeight,
+                    // 线条宽度
+                    strokeStyle: e.style.strokeStyle
+                    // 线条样式
+                  });
+                }), c;
+              }
+            });
+            s.value.add(r);
+          }
+        } catch {
+        }
+      }, H = (a, e, t) => {
+        try {
+          const r = new a.GeoJSONSource({
+            data: t
+          }), l = new a.PointLayer({
+            zIndex: e.zIndex,
+            blend: e.blend,
+            visible: e.visible,
+            opacity: e.opacity
+          }), i = {
+            radius: e.style.radius,
+            unit: e.style.unit,
+            color: e.style.color,
+            borderWidth: e.style.borderWidth,
+            blurWidth: e.style.blurWidth,
+            borderColor: e.style.borderColor
+          };
+          l.setSource(r), l.setStyle(i), n.value.add(l), l.addAnimate({
+            key: e.animate.key,
+            value: e.animate.value,
+            duration: e.animate.duration,
+            easing: e.animate.easing,
+            transform: e.animate.transform,
+            random: e.animate.random,
+            delay: e.animate.delay,
+            yoyo: e.animate.yoyo,
+            repeat: e.animate.repeat
+          });
+        } catch {
+        }
+      }, N = (a, e, t) => {
+        try {
+          const r = new a.GeoJSONSource({
+            data: t
+          }), l = new a.ScatterLayer({
+            loca: n.value,
+            zIndex: e.zIndex,
+            opacity: e.opacity,
+            visible: e.visible,
+            zooms: e.zooms
+          });
+          l.setSource(r), l.setStyle({
+            unit: e.style.unit,
+            size: e.style.size,
+            borderWidth: e.style.borderWidth,
+            texture: e.style.texture,
+            duration: e.style.duration,
+            animate: e.style.animate
+          }), n.value.animate.start();
+        } catch {
+        }
+      }, F = (a, e, t) => {
+        try {
+          const r = new a.GeoJSONSource({
+            data: t
+          }), l = new a.LabelsLayer({
+            eventSupport: !0,
+            visible: e.visible,
+            zooms: e.zooms,
+            opacity: e.opacity,
+            collision: e.collision,
+            allowCollision: e.allowCollision,
+            zIndex: e.zIndex
+          });
+          l.on("click", (i) => {
+          }), l.setSource(r), l.setStyle({
+            icon: {
+              image: e.icon.image,
+              size: e.icon.size,
+              clipOrigin: e.icon.clipOrigin,
+              offset: e.icon.offset,
+              anchor: e.icon.anchor
+            },
+            text: {
+              // 每项配置都可使用回调函数来动态配置
+              content: (i, c) => c.properties[e.text.content],
+              zooms: e.text.zooms,
+              offset: e.text.offset,
+              direction: e.text.direction,
+              style: {
+                fontSize: e.text.style.fontSize,
+                fillColor: e.text.style.fillColor,
+                strokeColor: e.text.style.strokeColor,
+                strokeWidth: e.text.style.strokeWidth,
+                padding: e.text.style.padding,
+                backgroundColor: e.text.style.backgroundColor,
+                borderColor: e.text.style.borderColor,
+                borderWidth: e.text.style.borderWidth,
+                fold: e.text.style.fold,
+                fontWeight: e.text.style.fontWeight
+              }
+            }
+          }), n.value.add(l);
+        } catch {
+        }
+      }, w = (a) => {
+        const e = {
+          type: "FeatureCollection",
+          features: []
+        };
+        return a.forEach((t, r) => {
+          const l = {
+            type: "Feature",
+            id: le(),
+            properties: {
+              name: t.name || "",
+              _draw_type: "point"
+            },
+            geometry: {
+              type: "Point",
+              coordinates: t.value
+            }
+          };
+          e.features.push(l);
+        }), e;
+      }, G = (a) => {
+        s.value.setFeatures(a.config.features), s.value.setStatus({
+          dragEnable: a.config.dragEnable,
+          zoomEnable: a.config.zoomEnable,
+          rotateEnable: a.config.rotateEnable
+        }), a.config.plugin.scale.visible ? f.value.show() : f.value.hide(), a.config.plugin.toolBar.visible ? y.value.show() : y.value.hide(), a.config.plugin.controlBar.visible ? m.value.show() : m.value.hide();
+      }, T = () => {
+        s.value.clearMap(), n.value.clear(), z(v.value);
+      }, Z = (a) => {
+        s.value.setMapStyle(a.config.mapStyle);
+      }, j = (a) => {
+        s.value.setZoom(a.config.zoom, !1, 200);
+      }, R = (a) => {
+        s.value.setCenter(a.config.center, !1, 200);
+      }, k = () => {
+        s.value && (s.value.clearMap(), s.value.destroy(), s.value = null, n.value && (n.value.clear(), n.value.destroy(), n.value = null));
+      };
+      return Y(() => {
+        setTimeout(() => {
+          S(o.basicOption);
+        }, 0);
+      }), $(() => k()), {
+        initAMap2d: S,
+        updateAMapStyle: Z,
+        updateAMapConfig: G,
+        updateAMapComponents: T,
+        updateAMapZoom: j,
+        updateAMapCenter: R,
+        amap2d: s,
+        loading: C,
+        AMapPrototype: v
+      };
+    }, {
+      initAMap2d: b,
+      updateAMapStyle: W,
+      updateAMapConfig: h,
+      updateAMapComponents: L,
+      updateAMapZoom: _,
+      updateAMapCenter: P,
+      loading: I,
+      AMapPrototype: de
+    } = B();
+    return d(() => o.basicOption.config, () => {
+      h(o.basicOption);
+    }, { deep: !0 }), d(() => o.basicOption.config.zoom, () => {
+      _(o.basicOption);
+    }, { deep: !0 }), d(() => o.basicOption.config.center, () => {
+      P(o.basicOption);
+    }, { deep: !0 }), d(() => o.basicOption.widgets, () => {
+      L();
+    }, { deep: !0 }), d(() => o.basicOption.config.mapStyle, () => {
+      W(o.basicOption);
+    }, { deep: !0 }), d(() => o.basicOption.basic, () => {
+      b(o.basicOption);
+    }, { deep: !0 }), d(() => o.sources, () => {
+      b(o.basicOption);
+    }, { deep: !0 }), M({
+      refresh: () => b(o.basicOption),
+      refreshView: () => h(o.basicOption),
+      refreshData: () => h(o.basicOption)
+    }), (s, n) => (q(), K("div", {
+      class: Q(["amap-2d-wrap", { show: X(I) }])
+    }, ce, 2));
+  }
+});
+export {
+  ye as default
+};

package/es/components/scene-amap3d/index.d.ts

@@ -0,0 +1,67 @@
+export declare const ZvSceneAmap3d: import("../../utils/typescript").SFCWithInstall<import("vue").DefineComponent<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: any;
+        required: true;
+    };
+    globalEvent: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+}, {
+    props: any;
+    emit: (event: "amap3d-scene-success" | "amap3d-scene-zoomstart" | "amap3d-scene-zoomend" | "amap3d-scene-mapclick" | "amap3d-scene-dragstart" | "amap3d-scene-dragging" | "amap3d-scene-dragend" | "amap3d-scene-pulseLinkLayer", ...args: any[]) => void;
+    useAMap3d: () => {
+        initAMap3d: (option: any) => void;
+        updateAMapStyle: (option: any) => void;
+        updateAMapConfig: (option: any) => void;
+        updateAMapComponents: () => void;
+        updateAMapZoom: (option: any) => void;
+        updateAMapCenter: (option: any) => void;
+        amap3d: import("vue").ShallowRef<any>;
+        loading: import("vue").Ref<boolean>;
+        AMapPrototype: import("vue").Ref<any>;
+    };
+    initAMap3d: (option: any) => void;
+    updateAMapStyle: (option: any) => void;
+    updateAMapConfig: (option: any) => void;
+    updateAMapComponents: () => void;
+    updateAMapZoom: (option: any) => void;
+    updateAMapCenter: (option: any) => void;
+    loading: import("vue").Ref<boolean>;
+    AMapPrototype: import("vue").Ref<any>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("amap3d-scene-success" | "amap3d-scene-zoomstart" | "amap3d-scene-zoomend" | "amap3d-scene-mapclick" | "amap3d-scene-dragstart" | "amap3d-scene-dragging" | "amap3d-scene-dragend" | "amap3d-scene-pulseLinkLayer")[], "amap3d-scene-success" | "amap3d-scene-zoomstart" | "amap3d-scene-zoomend" | "amap3d-scene-mapclick" | "amap3d-scene-dragstart" | "amap3d-scene-dragging" | "amap3d-scene-dragend" | "amap3d-scene-pulseLinkLayer", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: any;
+        required: true;
+    };
+    globalEvent: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+}>> & {
+    "onAmap3d-scene-success"?: (...args: any[]) => any;
+    "onAmap3d-scene-zoomstart"?: (...args: any[]) => any;
+    "onAmap3d-scene-zoomend"?: (...args: any[]) => any;
+    "onAmap3d-scene-mapclick"?: (...args: any[]) => any;
+    "onAmap3d-scene-dragstart"?: (...args: any[]) => any;
+    "onAmap3d-scene-dragging"?: (...args: any[]) => any;
+    "onAmap3d-scene-dragend"?: (...args: any[]) => any;
+    "onAmap3d-scene-pulseLinkLayer"?: (...args: any[]) => any;
+}, {}, {}>> & Record<string, any>;
+export default ZvSceneAmap3d;

package/es/components/scene-amap3d/index.mjs

@@ -0,0 +1,7 @@
+import t from "./index.vue.mjs";
+import { withInstall as o } from "../../utils/install.mjs";
+const m = o(t);
+export {
+  m as ZvSceneAmap3d,
+  m as default
+};

package/es/components/scene-amap3d/index.vue.d.ts

@@ -0,0 +1,67 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: any;
+        required: true;
+    };
+    globalEvent: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+}, {
+    props: any;
+    emit: (event: "amap3d-scene-success" | "amap3d-scene-zoomstart" | "amap3d-scene-zoomend" | "amap3d-scene-mapclick" | "amap3d-scene-dragstart" | "amap3d-scene-dragging" | "amap3d-scene-dragend" | "amap3d-scene-pulseLinkLayer", ...args: any[]) => void;
+    useAMap3d: () => {
+        initAMap3d: (option: any) => void;
+        updateAMapStyle: (option: any) => void;
+        updateAMapConfig: (option: any) => void;
+        updateAMapComponents: () => void;
+        updateAMapZoom: (option: any) => void;
+        updateAMapCenter: (option: any) => void;
+        amap3d: import("vue").ShallowRef<any>;
+        loading: import("vue").Ref<boolean>;
+        AMapPrototype: import("vue").Ref<any>;
+    };
+    initAMap3d: (option: any) => void;
+    updateAMapStyle: (option: any) => void;
+    updateAMapConfig: (option: any) => void;
+    updateAMapComponents: () => void;
+    updateAMapZoom: (option: any) => void;
+    updateAMapCenter: (option: any) => void;
+    loading: import("vue").Ref<boolean>;
+    AMapPrototype: import("vue").Ref<any>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("amap3d-scene-success" | "amap3d-scene-zoomstart" | "amap3d-scene-zoomend" | "amap3d-scene-mapclick" | "amap3d-scene-dragstart" | "amap3d-scene-dragging" | "amap3d-scene-dragend" | "amap3d-scene-pulseLinkLayer")[], "amap3d-scene-success" | "amap3d-scene-zoomstart" | "amap3d-scene-zoomend" | "amap3d-scene-mapclick" | "amap3d-scene-dragstart" | "amap3d-scene-dragging" | "amap3d-scene-dragend" | "amap3d-scene-pulseLinkLayer", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: any;
+        required: true;
+    };
+    globalEvent: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+}>> & {
+    "onAmap3d-scene-success"?: (...args: any[]) => any;
+    "onAmap3d-scene-zoomstart"?: (...args: any[]) => any;
+    "onAmap3d-scene-zoomend"?: (...args: any[]) => any;
+    "onAmap3d-scene-mapclick"?: (...args: any[]) => any;
+    "onAmap3d-scene-dragstart"?: (...args: any[]) => any;
+    "onAmap3d-scene-dragging"?: (...args: any[]) => any;
+    "onAmap3d-scene-dragend"?: (...args: any[]) => any;
+    "onAmap3d-scene-pulseLinkLayer"?: (...args: any[]) => any;
+}, {}, {}>;
+export default _sfc_main;

package/es/components/scene-amap3d/index.vue.mjs

@@ -0,0 +1,7 @@
+import o from "./index.vue2.mjs";
+/* empty css            */
+import t from "../../_virtual/_plugin-vue_export-helper.mjs";
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-fd3825f4"]]);
+export {
+  m as default
+};