fix: 1

src/view/map/install.ts

@@ -41,24 +41,6 @@ addScale(mapManage);
 const noValidPoint = (pos: ScenePoint) => !pos.pos || pos.pos.length === 0;
 const validScene = (scene: Scene) => !scene.scenePos.every(noValidPoint);
 
-export const autoInitPos = () => {
-  const scene = scenes.value.find(validScene);
-  if (scene) {
-    flyScene(scene);
-    return true;
-  } else {
-    return false;
-  }
-};
-
-watch(
-  () => scenes.value.find(validScene)?.sceneCode,
-  (code) => {
-    code && autoInitPos();
-  },
-  { immediate: true }
-);
-
 export const flyScene = (scene: Scene) => {
   console.log("flyScene", scene);
   const totalPos = [0, 0];
@@ -84,6 +66,24 @@ export const gotoPointPage = (point: ScenePoint) => {
   });
 };
 
+export const autoInitPos = () => {
+  const scene = scenes.value.find(validScene);
+  if (scene) {
+    flyScene(scene);
+    return true;
+  } else {
+    return false;
+  }
+};
+
+watch(
+  () => scenes.value.find(validScene)?.sceneCode,
+  (code) => {
+    code && autoInitPos();
+  },
+  { immediate: true }
+);
+
 // -------board------
 export const board = createBoard({ map: mapManage.map });
 watch(boardData, (data) => data && board.setData(data), {

src/view/map/layout.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="map-layout">
+  <div class="map-layout" v-loading="!loaded || captureing">
     <div class="custom_bar">
       <div class="back_container" v-if="!queryMode">
         <el-button :icon="Back" circle type="primary" @click="router.back()" />
@@ -26,6 +26,8 @@
       <div class="map-container" :ref="setMapContainer">
         <div class="board" :ref="setBoardContainer"></div>
         <div class="map-top-out-pano">
+          <el-button @click="capture" v-if="loaded"> 屏幕截图 </el-button>
+
           <el-button @click="showPoints = !showPoints">
             <el-checkbox :modelValue="showPoints" label="点位" size="large" />
           </el-button>
@@ -86,11 +88,12 @@ import {
   defaultCenter,
   tileType,
 } from "./install";
-import { ref, watch } from "vue";
+import { nextTick, ref, watch } from "vue";
 import { initRelics, relics } from "@/store/relics";
 import { queryMode } from "./install";
 import { PoPoint } from "drawing-board";
 import { boardData } from "@/store/scene";
+import saveAs from "@/util/file-serve";
 
 const menus = [
   {
@@ -147,6 +150,18 @@ watch(
   },
   { immediate: true, flush: "post" }
 );
+
+const captureing = ref(false);
+const capture = async () => {
+  captureing.value = true;
+  await nextTick();
+  try {
+    const dataURL = await board.toDataURL(2);
+    await saveAs(dataURL, "map.png");
+  } finally {
+    captureing.value = false;
+  }
+};
 </script>
 
 <style lang="scss" scoped>

src/view/map/openlayer/tile.ts

@@ -63,6 +63,7 @@ const getWMTS = (type: TileType, mapEpsg: string) => {
   const url = `https://t0.tianditu.gov.cn/${layer}_c/wmts?tk=${key}`;
   return new WMTS({
     url,
+    crossOrigin: "anonymous", // 设置跨域
     layer,
     version: "1.0.0",
     matrixSet: "c",

src/view/map/polygons.vue

@@ -80,6 +80,7 @@ import picpenIcon from "@/assets/pic_pen.svg";
 
 const boardStatus = board.polygon.status;
 const selectId = ref<string>();
+
 const selectChange = (id: string) => {
   if (currentItem.value) return;
   if (selectId.value === id) {
@@ -101,12 +102,8 @@ const selectChange = (id: string) => {
     }
   }
 };
-board.polygon.bus.on("clickPolygon", (item) => selectChange(item.id));
-board.polygon.container.stage.on("click.checkSelect", (ev) => {
-  if (ev.target === board.polygon.container.stage) {
-    selectChange(null);
-  }
-});
+
+board.polygon.bus.on("activePolygonId", selectChange);
 
 const selectItem = computed(() =>
   boardData.value.polygons.find(({ id }) => id === selectId.value)
@@ -139,8 +136,6 @@ const enterEdit = () => {
 onBeforeUnmount(() => {
   cleanupEdit.value && cleanupEdit.value();
   board.polygon.status.lightPointId = null;
-  board.polygon.bus.off("clickPolygon");
-  board.polygon.container.stage.off("click.checkSelect");
 });
 
 const isShowPolyEditName = ref(false);

tsconfig.json

@@ -27,8 +27,8 @@
         "src/*"
       ],
       "drawing-board": [
-        "./src/lib/board/4dmap.d.ts"
-        // "../drawing-board/src/app/4dmap/index.ts"
+        // "./src/lib/board/4dmap.d.ts"
+        "../drawing-board/src/app/4dmap/index.ts"
       ]
     }
   },

vite.config.ts

@@ -16,11 +16,11 @@ export default ({ mode }: any) =>
         },
         {
           find: "drawing-board",
-          replacement: resolve(__dirname, "./src/lib/board/4dmap.js"),
-          // replacement: resolve(
-          //   __dirname,
-          //   "../drawing-board/src/app/4dmap/index.ts"
-          // ),
+          // replacement: resolve(__dirname, "./src/lib/board/4dmap.js"),
+          replacement: resolve(
+            __dirname,
+            "../drawing-board/src/app/4dmap/index.ts"
+          ),
         },
       ],
     },