Procházet zdrojové kódy

图例 联动 勾选

haojianlong před 4 roky
rodič
revize
f02ed669e3
1 změnil soubory, kde provedl 43 přidání a 18 odebrání
  1. 43 18
      src/components/floorMap/index.vue

+ 43 - 18
src/components/floorMap/index.vue

@@ -5,14 +5,7 @@
     <canvas :id="`canvas${id}`" :width="canvasWidth" :height="canvasHeight" tabindex="0"></canvas>
     <!-- 地图底部操作按钮 -->
     <div class="strip-bottom">
-      <canvasFun
-        @fit="fit"
-        @savePng="savePng"
-        @saveSvg="saveSvg"
-        @saveJson="saveJson"
-        @scale="scale"
-        ref="canvasFun"
-      ></canvasFun>
+      <canvasFun @fit="fit" @savePng="savePng" @saveSvg="saveSvg" @saveJson="saveJson" @scale="scale" ref="canvasFun"></canvasFun>
     </div>
     <room-box ref="boxRoom"></room-box>
   </div>
@@ -28,6 +21,8 @@ import { readGroup } from "@/api/public";
 import { STopologyParser } from "@/lib/parsers/STopologyParser";
 import { mapGetters, mapActions } from "vuex";
 import { SImageItem } from "@saga-web/graph/lib";
+import bus from "@/utils/bus.js"
+
 // import { uuid } from "@/components/mapClass/until";
 
 export default {
@@ -42,7 +37,8 @@ export default {
       view: null,
       urlMsg: {},
       canvasID: "canvas",
-      floorid: "" //楼层id
+      floorid: "", //楼层id
+      topologyParser: null, // 解析器数据
     };
   },
   props: {
@@ -76,7 +72,7 @@ export default {
           }
           this.parserData(floorid);
         }
-      },100);
+      }, 100);
     },
     parserData(floor) {
       if (floor == "g80") {
@@ -133,31 +129,31 @@ export default {
           //console.log(data.data.Data[0].ID)
           this.$cookie.set("graphId", data.Data[0].ID, 3);
         }
-        const parserData = new STopologyParser(null);
-        parserData.parseData(data.Data[0].Elements);
+        this.topologyParser = new STopologyParser(null);
+        this.topologyParser.parseData(data.Data[0].Elements);
         // 多边形
-        parserData.zoneLegendList.forEach(t => {
+        this.topologyParser.zoneLegendList.forEach(t => {
           this.scene.addItem(t);
         });
         // 增加文字
-        parserData.textMarkerList.forEach(t => {
+        this.topologyParser.textMarkerList.forEach(t => {
           this.scene.addItem(t);
         });
         // 增加图片
-        parserData.imageMarkerList.forEach(t => {
+        this.topologyParser.imageMarkerList.forEach(t => {
           this.scene.addItem(t);
         });
         // 增加直线
-        parserData.lineMarkerList.forEach(t => {
+        this.topologyParser.lineMarkerList.forEach(t => {
           this.scene.addItem(t);
         });
         // 增加图标类图例
-        parserData.imageLegendList.forEach(t => {
+        this.topologyParser.imageLegendList.forEach(t => {
           this.scene.addItem(t);
         });
         // 增加管线类
         // 增加图标类图例
-        parserData.relationList.forEach(t => {
+        this.topologyParser.relationList.forEach(t => {
           this.scene.addItem(t);
         });
         this.view.fitSceneToView();
@@ -225,6 +221,34 @@ export default {
         this.canvasWidth = this.$refs.graphy.offsetWidth;
         this.canvasHeight = 900;
       }
+    },
+    getEvent() {
+      bus.$on('changeShow', res => {
+        this.topologyParser.zoneLegendList.forEach(t => {
+          let id = t.data.GraphElementId
+          t.maskFlag = !(res.indexOf(id) > -1)
+        })
+        this.topologyParser.textMarkerList.forEach(t => {
+          let id = t.data.GraphElementId
+          t.maskFlag = !(res.indexOf(id) > -1)
+        });
+        this.topologyParser.imageMarkerList.forEach(t => {
+          let id = t.data.GraphElementId
+          t.maskFlag = !(res.indexOf(id) > -1)
+        });
+        this.topologyParser.lineMarkerList.forEach(t => {
+          let id = t.data.GraphElementId
+          t.maskFlag = !(res.indexOf(id) > -1)
+        });
+        this.topologyParser.imageLegendList.forEach(t => {
+          let id = t.data.GraphElementId
+          t.maskFlag = !(res.indexOf(id) > -1)
+        });
+        this.topologyParser.relationList.forEach(t => {
+          let id = t.data.GraphElementId
+          t.maskFlag = !(res.indexOf(id) > -1)
+        });
+      })
     }
   },
   watch: {
@@ -244,6 +268,7 @@ export default {
   },
   mounted() {
     this.mapSize();
+    this.getEvent()
   },
   created() {
     this.urlMsg = {