ym-giswidget-2d 1.0.48 → 1.0.50

package/README.md

@@ -1,33 +1,33 @@
-# olComponents
-
-This template should help get you started developing with Vue 3 in Vite.
-
-## Recommended IDE Setup
-
-[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
-
-## Type Support for `.vue` Imports in TS
-
-TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
-
-## Customize configuration
-
-See [Vite Configuration Reference](https://vitejs.dev/config/).
-
-## Project Setup
-
-```sh
-pnpm install
-```
-
-### Compile and Hot-Reload for Development
-
-```sh
-pnpm dev
-```
-
-### Type-Check, Compile and Minify for Production
-
-```sh
-pnpm build
-```
+# olComponents
+
+This template should help get you started developing with Vue 3 in Vite.
+
+## Recommended IDE Setup
+
+[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
+
+## Type Support for `.vue` Imports in TS
+
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
+
+## Customize configuration
+
+See [Vite Configuration Reference](https://vitejs.dev/config/).
+
+## Project Setup
+
+```sh
+pnpm install
+```
+
+### Compile and Hot-Reload for Development
+
+```sh
+pnpm dev
+```
+
+### Type-Check, Compile and Minify for Production
+
+```sh
+pnpm build
+```

package/assets/font/iconfont.css

@@ -1,39 +1,39 @@
-@font-face {
-  font-family: "iconfont"; /* Project id 4810358 */
-  src: url('iconfont.woff2?t=1736821977689') format('woff2'),
-       url('iconfont.woff?t=1736821977689') format('woff'),
-       url('iconfont.ttf?t=1736821977689') format('truetype');
-}
-
-.iconfont {
-  font-family: "iconfont" !important;
-  font-size: 16px;
-  font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-undock:before {
-  content: "\e718";
-}
-
-.icon-dock:before {
-  content: "\e601";
-}
-
-.icon-minimize:before {
-  content: "\e646";
-}
-
-.icon-restore:before {
-  content: "\e600";
-}
-
-.icon-close:before {
-  content: "\e70f";
-}
-
-.icon-maximize:before {
-  content: "\e651";
-}
-
+@font-face {
+  font-family: "iconfont"; /* Project id 4810358 */
+  src: url('iconfont.woff2?t=1736821977689') format('woff2'),
+       url('iconfont.woff?t=1736821977689') format('woff'),
+       url('iconfont.ttf?t=1736821977689') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-undock:before {
+  content: "\e718";
+}
+
+.icon-dock:before {
+  content: "\e601";
+}
+
+.icon-minimize:before {
+  content: "\e646";
+}
+
+.icon-restore:before {
+  content: "\e600";
+}
+
+.icon-close:before {
+  content: "\e70f";
+}
+
+.icon-maximize:before {
+  content: "\e651";
+}
+

package/assets/font/iconfont.json

@@ -1,51 +1,51 @@
-{
-  "id": "4810358",
-  "name": "print-map",
-  "font_family": "iconfont",
-  "css_prefix_text": "icon-",
-  "description": "",
-  "glyphs": [
-    {
-      "icon_id": "21967058",
-      "name": "未停靠",
-      "font_class": "undock",
-      "unicode": "e718",
-      "unicode_decimal": 59160
-    },
-    {
-      "icon_id": "39867073",
-      "name": "停靠",
-      "font_class": "dock",
-      "unicode": "e601",
-      "unicode_decimal": 58881
-    },
-    {
-      "icon_id": "659177",
-      "name": "最小化",
-      "font_class": "minimize",
-      "unicode": "e646",
-      "unicode_decimal": 58950
-    },
-    {
-      "icon_id": "4485682",
-      "name": "还原窗体",
-      "font_class": "restore",
-      "unicode": "e600",
-      "unicode_decimal": 58880
-    },
-    {
-      "icon_id": "6705520",
-      "name": "关闭",
-      "font_class": "close",
-      "unicode": "e70f",
-      "unicode_decimal": 59151
-    },
-    {
-      "icon_id": "11490920",
-      "name": "最大化",
-      "font_class": "maximize",
-      "unicode": "e651",
-      "unicode_decimal": 58961
-    }
-  ]
-}
+{
+  "id": "4810358",
+  "name": "print-map",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "21967058",
+      "name": "未停靠",
+      "font_class": "undock",
+      "unicode": "e718",
+      "unicode_decimal": 59160
+    },
+    {
+      "icon_id": "39867073",
+      "name": "停靠",
+      "font_class": "dock",
+      "unicode": "e601",
+      "unicode_decimal": 58881
+    },
+    {
+      "icon_id": "659177",
+      "name": "最小化",
+      "font_class": "minimize",
+      "unicode": "e646",
+      "unicode_decimal": 58950
+    },
+    {
+      "icon_id": "4485682",
+      "name": "还原窗体",
+      "font_class": "restore",
+      "unicode": "e600",
+      "unicode_decimal": 58880
+    },
+    {
+      "icon_id": "6705520",
+      "name": "关闭",
+      "font_class": "close",
+      "unicode": "e70f",
+      "unicode_decimal": 59151
+    },
+    {
+      "icon_id": "11490920",
+      "name": "最大化",
+      "font_class": "maximize",
+      "unicode": "e651",
+      "unicode_decimal": 58961
+    }
+  ]
+}

package/components/area-measurement/AreaMeasurement.vue.d.ts

@@ -1,8 +1,27 @@
 import { default as OLMap } from 'ym-gis-2d/mapView/Map';
+import { default as IFont } from 'ym-gis-2d/entity/IFont';
 type __VLS_Props = {
     map: OLMap;
+    color?: Array<number> | string;
+    opacity?: number;
+    outlineColor?: Array<number> | string;
+    outlineOpacity?: number;
+    outlineWidth?: number;
+    font?: IFont;
+    unit?: "square-meters" | "square-kilometers" | "mu" | "hectare";
+    precision?: number;
+    showLabel?: boolean;
+    spheroid?: boolean;
 };
-declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    activeInteraction: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onActiveInteraction?: ((...args: any[]) => any) | undefined;
+}>, {
+    precision: number;
+    showLabel: boolean;
+    spheroid: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     areaMeasureDom: ({
         $: import('vue').ComponentInternalInstance;
         $data: {};

package/components/area-measurement/AreaMeasurement.vue.js

@@ -4,10 +4,11 @@ import "element-plus/es/components/form/style/css";
 import "element-plus/es/components/form-item/style/css";
 import "element-plus/es/components/select/style/css";
 import "element-plus/es/components/option/style/css";
-import { defineComponent, reactive, onMounted, onUnmounted, withDirectives, createBlock, openBlock, withCtx, createVNode, unref, createCommentVNode, createElementBlock, Fragment, renderList, createElementVNode, toDisplayString, vShow } from "vue";
+import { defineComponent, reactive, computed, onMounted, toRaw, onUnmounted, withDirectives, createBlock, openBlock, withCtx, createVNode, unref, createCommentVNode, createElementBlock, Fragment, renderList, createElementVNode, toDisplayString, vShow } from "vue";
 import DraggablePanel from "../../panel/DraggablePanel.vue.js";
-import Draw from "ym-gis-2d/interaction/Draw";
-import { getArea } from "ym-gis-2d/utils/GeometryUtil";
+import AreaMeasure from "ym-gis-2d/interaction/AreaMeasure";
+import measureUnits from "ym-gis-2d/entity/measure/AreaMeasureUnits";
+import { polygonToLines, getLength } from "ym-gis-2d/utils/GeometryUtil";
 const _hoisted_1 = { class: "el-current-value" };
 const _hoisted_2 = { class: "el-current-unit" };
 const _hoisted_3 = { class: "el-current-value" };
@@ -15,82 +16,93 @@ const _hoisted_4 = { class: "el-current-unit" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "AreaMeasurement",
   props: {
-    map: {}
+    map: {},
+    color: {},
+    opacity: {},
+    outlineColor: {},
+    outlineOpacity: {},
+    outlineWidth: {},
+    font: {},
+    unit: {},
+    precision: { default: 2 },
+    showLabel: { type: Boolean, default: true },
+    spheroid: { type: Boolean, default: false }
   },
-  setup(__props) {
+  emits: ["activeInteraction"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
     const props = __props;
     let reactiveValue = reactive({
       visible: true,
       allArea: 0,
       allPerimeter: 0,
-      measureTypes: [
-        {
-          type: "square-meters",
-          label: "平方米",
-          persimeterLabel: "米"
-        },
-        {
-          type: "square-kilometers",
-          label: "平方公里",
-          persimeterLabel: "千米"
-        },
-        {
-          type: "mu",
-          label: "亩",
-          persimeterLabel: "米"
-        },
-        {
-          type: "hectare",
-          label: "公顷",
-          persimeterLabel: "千米"
-        }
-      ]
+      hasArea: 0,
+      hasPerimeter: 0
     });
-    reactiveValue.currentType = reactiveValue.measureTypes[0];
-    onMounted(() => {
-      const tempLayer = props.map.getPolygonTempLayer();
-      let source = void 0;
-      const layersource = tempLayer == null ? void 0 : tempLayer.getSource();
-      if (layersource) {
-        source = layersource;
+    reactiveValue.currentType = measureUnits[0];
+    const measureData = computed(() => {
+      var _a;
+      switch ((_a = reactiveValue.currentType) == null ? void 0 : _a.type) {
+        case "square-meters":
+          return {
+            area: `${reactiveValue.allArea.toFixed(props.precision)}`,
+            perimeter: `${reactiveValue.allPerimeter.toFixed(props.precision)}`
+          };
+        case "square-kilometers":
+          return {
+            area: `${(reactiveValue.allArea * 1e-6).toFixed(props.precision)}`,
+            perimeter: `${(reactiveValue.allPerimeter * 1e-3).toFixed(props.precision)}`
+          };
+        case "mu":
+          return {
+            area: `${(reactiveValue.allArea * 15e-4).toFixed(props.precision)}`,
+            perimeter: `${reactiveValue.allPerimeter.toFixed(props.precision)}`
+          };
+        case "hectare":
+          return {
+            area: `${(reactiveValue.allArea * 1e-4).toFixed(props.precision)}`,
+            perimeter: `${(reactiveValue.allPerimeter * 1e-3).toFixed(props.precision)}`
+          };
+        default:
+          return {
+            area: `${reactiveValue.allArea.toFixed(props.precision)} `,
+            perimeter: `${reactiveValue.allPerimeter.toFixed(props.precision)} `
+          };
       }
-      const draw = new Draw("polygon", {
-        source,
-        tipText: "点击开始测量，双击结束测量"
-      });
-      props.map.interactionManager.addInteraction("areaMeasure", draw);
-      draw.on("drawend", (event) => {
-        const features = event.feature;
-        if (features) {
-          features.isSelected = true;
-          features.tempLayer = tempLayer;
-          features.fromType = "draw";
-        }
-      });
-      draw.on("drawaddpoint", (event) => {
-        const features = event.feature;
-        if (features) {
-          features.isSelected = true;
-          features.tempLayer = tempLayer;
-          features.fromType = "draw";
+    });
+    onMounted(() => {
+      let { map, ...options } = toRaw(props);
+      const areaMeasure = new AreaMeasure(options);
+      props.map.interactionManager.addInteraction("areaMeasure", areaMeasure);
+      areaMeasure.on("measureMoving", (e) => {
+        reactiveValue.allArea = reactiveValue.hasArea + e.area;
+        const lines = polygonToLines(e.geom);
+        if (lines) {
+          reactiveValue.allPerimeter = reactiveValue.hasPerimeter + getLength(lines[0], props.map.getView().getProjection());
         }
       });
-      draw.on("drawmoving", (event) => {
-        var _a;
-        if (!event.coordinates || event.coordinates.length < 2) {
-          return;
+      areaMeasure.on("measureEnd", (e) => {
+        reactiveValue.hasArea += e.area;
+        const lines = polygonToLines(e.geom);
+        if (lines) {
+          reactiveValue.hasPerimeter += getLength(lines[0], props.map.getView().getProjection());
         }
-        const geometry = (_a = event.feature) == null ? void 0 : _a.getGeometry();
-        const area = getArea(geometry, props.map.getView().getProjection());
-        console.log(area);
       });
     });
     onUnmounted(() => {
       reactiveValue.visible = false;
+      const areaMeasure = props.map.interactionManager.getInteraction("areaMeasure");
+      areaMeasure.clearMeasure();
       props.map.interactionManager.removeInteraction("areaMeasure");
     });
     function handleClose() {
-      reactiveValue.visible = false;
+      emit("activeInteraction", { success: false, message: "" });
+    }
+    function changeUnit() {
+      const areaMeasure = props.map.interactionManager.getInteraction("areaMeasure");
+      if (reactiveValue.currentType && areaMeasure) {
+        areaMeasure.setUnit(reactiveValue.currentType.type);
+      }
     }
     return (_ctx, _cache) => {
       const _component_el_option = ElOption;
@@ -132,10 +144,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(reactiveValue).currentType = $event),
                     "value-key": "type",
                     class: "el-current",
-                    "popper-class": "el-current"
+                    "popper-class": "el-current",
+                    onChange: changeUnit
                   }, {
                     default: withCtx(() => [
-                      (openBlock(true), createElementBlock(Fragment, null, renderList(unref(reactiveValue).measureTypes, (item) => {
+                      (openBlock(true), createElementBlock(Fragment, null, renderList(unref(measureUnits), (item) => {
                         return openBlock(), createBlock(_component_el_option, {
                           key: item.type,
                           label: item.label,
@@ -156,7 +169,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 default: withCtx(() => {
                   var _a;
                   return [
-                    createElementVNode("span", _hoisted_1, toDisplayString(unref(reactiveValue).allArea), 1),
+                    createElementVNode("span", _hoisted_1, toDisplayString(measureData.value.area), 1),
                     createElementVNode("span", _hoisted_2, toDisplayString((_a = unref(reactiveValue).currentType) == null ? void 0 : _a.label), 1)
                   ];
                 }),
@@ -170,7 +183,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 default: withCtx(() => {
                   var _a;
                   return [
-                    createElementVNode("span", _hoisted_3, toDisplayString(unref(reactiveValue).allPerimeter), 1),
+                    createElementVNode("span", _hoisted_3, toDisplayString(measureData.value.perimeter), 1),
                     createElementVNode("span", _hoisted_4, toDisplayString((_a = unref(reactiveValue).currentType) == null ? void 0 : _a.persimeterLabel), 1)
                   ];
                 }),

package/components/area-measurement/index.d.ts

@@ -1,8 +1,36 @@
 export declare const AreaMeasurement: import('../../utils').WithInstall<import('vue').DefineComponent<{
     map: import('ym-gis-2d/mapView/Map').default;
-}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
+    color?: Array<number> | string;
+    opacity?: number;
+    outlineColor?: Array<number> | string;
+    outlineOpacity?: number;
+    outlineWidth?: number;
+    font?: import('ym-gis-2d/entity/IFont').default;
+    unit?: "square-meters" | "square-kilometers" | "mu" | "hectare";
+    precision?: number;
+    showLabel?: boolean;
+    spheroid?: boolean;
+}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    activeInteraction: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<{
     map: import('ym-gis-2d/mapView/Map').default;
-}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    color?: Array<number> | string;
+    opacity?: number;
+    outlineColor?: Array<number> | string;
+    outlineOpacity?: number;
+    outlineWidth?: number;
+    font?: import('ym-gis-2d/entity/IFont').default;
+    unit?: "square-meters" | "square-kilometers" | "mu" | "hectare";
+    precision?: number;
+    showLabel?: boolean;
+    spheroid?: boolean;
+}> & Readonly<{
+    onActiveInteraction?: ((...args: any[]) => any) | undefined;
+}>, {
+    precision: number;
+    showLabel: boolean;
+    spheroid: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     areaMeasureDom: ({
         $: import('vue').ComponentInternalInstance;
         $data: {};

package/components/draw/Draw.vue.d.ts

@@ -1,6 +1,9 @@
 import { default as OLMap } from 'ym-gis-2d/mapView/Map';
+import { default as IStyle } from 'ym-gis-2d/entity/style/IStyle';
 type __VLS_Props = {
     map: OLMap;
+    geometryType?: "polygon" | "point" | "polyline" | "rectangle" | "circle";
+    style?: IStyle;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/components/draw/Draw.vue.js

@@ -3,14 +3,18 @@ import Draw from "ym-gis-2d/interaction/Draw";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Draw",
   props: {
-    map: {}
+    map: {},
+    geometryType: {},
+    style: {}
   },
   setup(__props) {
     const props = __props;
     onMounted(() => {
       const currentLayerInfo = props.map.currentEditLayer;
       let geometryType = "polygon";
-      if (currentLayerInfo && currentLayerInfo.geometryType) {
+      if (props.geometryType) {
+        geometryType = props.geometryType;
+      } else if (currentLayerInfo && currentLayerInfo.geometryType) {
         switch (currentLayerInfo.geometryType) {
           case 1:
             geometryType = "point";
@@ -30,7 +34,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         source = layersource;
       }
       const draw = new Draw(geometryType, {
-        source
+        source,
+        style: props.style
       });
       props.map.interactionManager.addInteraction("draw", draw);
       draw.on("drawend", (event) => {

package/components/draw/index.d.ts

@@ -1,6 +1,10 @@
 export declare const Draw: import('../../utils').WithInstall<import('vue').DefineComponent<{
     map: import('ym-gis-2d/mapView/Map').default;
+    geometryType?: "polygon" | "point" | "polyline" | "rectangle" | "circle";
+    style?: import('ym-gis-2d/entity/style/IStyle').default;
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
     map: import('ym-gis-2d/mapView/Map').default;
+    geometryType?: "polygon" | "point" | "polyline" | "rectangle" | "circle";
+    style?: import('ym-gis-2d/entity/style/IStyle').default;
 }> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>>;
 export default Draw;

package/components/export/Export.vue.js

@@ -1,7 +1,7 @@
 import _sfc_main from "./Export.vue2.js";
 /* empty css            */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
-const _Export = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-11975a70"]]);
+const _Export = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e716c04f"]]);
 export {
   _Export as default
 };

package/components/export/index.css

@@ -1,3 +1,3 @@
-.panel-content[data-v-11975a70] .el-form-item {
+.panel-content[data-v-e716c04f] .el-form-item {
   margin-bottom: 10px;
 }

package/components/horizontally-top-toolbar/HorizontallyTopToolbar.vue.js

@@ -1,7 +1,7 @@
 import _sfc_main from "./HorizontallyTopToolbar.vue2.js";
 /* empty css                            */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
-const _HorizontallyTopToolbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f42f3be5"]]);
+const _HorizontallyTopToolbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-75b81512"]]);
 export {
   _HorizontallyTopToolbar as default
 };

package/components/horizontally-top-toolbar/HorizontallyTopToolbar.vue2.js

@@ -192,7 +192,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
     function handleActiveInteraction(event, tool) {
       if (!event.success) {
-        ElMessage.error(event.message);
+        if (event.message) {
+          ElMessage.error(event.message);
+        }
         tool.component = void 0;
         const find = reactiveValue.activeIds.findIndex((t) => t == tool.id);
         if (find > -1) {