关系图定位、详情操作

src/components/echartsTemplate/graph.vue

@@ -136,7 +136,8 @@ export default {
         this.$emit("click", params)
       });
       // 监听右键点击事件
-      this.myChart.on('contextmenu', function (params) {
+      this.myChart.on('contextmenu', (params) => {
+        this.$emit("rightClick", params)
         let event = params.event
         // 阻止默认的右键菜单出现 even.preventDefault();
         event.stop()

src/utils/MapHelper/help.js

@@ -127,13 +127,13 @@ export function loadGeoJSON(geom, yanse, adata, fun) {
   //   }
   // });
 }
-export function removeGeoJSON(name) {
+export function removeGeoJSON(name, include) {
   if (!window.viewer) return;
   // viewer.entities.removeAll();
   // viewer.dataSources.removeAll();
   for (var i = viewer.dataSources._dataSources.length - 1; i >= 0; i--) {
     var das = viewer.dataSources._dataSources[i];
-    if (das.name == name) viewer.dataSources.remove(das);
+    if (include ? das.name.includes(name) : das.name == name) viewer.dataSources.remove(das);
   }
 }
 export async function Getlayers(mapurl, fun) {
@@ -309,16 +309,3 @@ export function str2Unicode(str) {
     es[i] = ("00" + str.charCodeAt(i).toString(16)).slice(-4);
   return "\\u" + es.join("\\u");
 }
-
-// 树结构只最后一级可以操作
-export function setDisabledIfChildrenExist(node) {
-  if (node.children && node.children.length > 0) {
-    node.disabled = true;
-  }
-  // 递归遍历子节点
-  if (node.children) {
-    node.children.forEach((child) => {
-      setDisabledIfChildrenExist(child);
-    });
-  }
-}

src/views/Idleland/components/info.vue

@@ -2,7 +2,7 @@
   <div class="inter_result">
     <!-- :header-cell-style="cellstyle" -->
     <el-table
-      :data="data.filter((item) => item.name !== 'id')"
+      :data="data.filter((item) => item.name !== 'id'&& item.name !== 'geom')"
       height="500"
       :class="fileList ? '' : 'infotabel'"
       style="width: 100%"

src/views/basicGeographic/entityManage.vue

@@ -9,9 +9,10 @@
       <el-tree @check="handleCheckChange" class="filter-tree" show-checkbox node-key="id" ref="tree" lazy
         :props="defaultProps" :load="getTree">
         <span class="custom-tree-node" slot-scope="{ node, data }">
-          <span :class="data.disabled ? '' : 'ellipsisText'" :title="node.label">{{ node.label }}{{ data.disabled ? `(${data.count || 0})` : ''}}</span>
+          <span :class="data.disabled ? '' : 'ellipsisText'" :title="node.label">{{ node.label }}
+            {{ data.disabled ? `(${data.count || 0})` : '' }}</span>
           <span>
-            <i v-if="!data.disabled" class="el-icon-s-order" @click="showDetail(data)"></i>
+            <i v-if="!data.disabled" class="el-icon-link" title="实体关系" @click="showDetail(data)"></i>
           </span>
         </span>
       </el-tree>

src/views/basicGeographic/index.vue

@@ -14,13 +14,17 @@
           @change="setSelected">
         </el-input>
       </div>
-      <graph id="first_pie" ref="graphEchart" @click="click"></graph>
+      <graph id="first_pie" ref="graphEchart" @click="click" @rightClick="rightClick"></graph>
       <div id="myContext" class="myContextMenu" style="display: none;">
         <div @click="fly"> 定位</div>
         <div @click="info">详情</div>
       </div>
     </div>
     <div class="sm-panel infoDiv" v-show="showinfo">
+      <div class="sm-panel-header">
+        <span> 详细信息 </span>
+        <span class="closeBtn" @click="showinfo = false">&times;</span>
+      </div>
       <Info :data="jbxxData"></Info>
     </div>
     <!-- <interDetails :rzBsm="rzBsm" @updateParent="changeData" :interObj="interObj" v-if="showInter"></interDetails>
@@ -73,7 +77,8 @@ export default {
       jbxxData: [],
       graloading: false,
       graphdata: [],
-      gralinks: []
+      gralinks: [],
+      nowgeoId: "",
     };
   },
   created() { },
@@ -82,12 +87,14 @@ export default {
   },
   methods: {
     click(params) {
-      console.log(params, "paramsparams");
       this.getRelationship(params.data)
     },
+    rightClick(params) {
+      this.nowObj = params.data
+    },
     checkChange(obj, checked) {
       if (checked) this.getData(obj)
-      else removeGeoJSON(obj.id)
+      else removeGeoJSON(`2wentity${obj.id}`)
     },
     detail(obj) {
       this.showInter = true
@@ -118,17 +125,12 @@ export default {
     getData(obj) {
       getData({ entityid: obj.id }).then((res) => {
         if (res.statuscode == 200) {
-          this.showinfo = true;
-          Object.keys(res.data).forEach((key) => {
-            this.jbxxData.push({ name: key, value: res.data.info[key], });
-          });
-          res.data.forEach(item => {
-            loadGeoJSON(item.geom.siweigeomewkt, "#facd91", { isfly: true }, (data) => {
-              geoSources[obj.id] = data;
-              data.name = obj.id;
+          //#facd91
+          res.data.geom.forEach(item => {
+            loadGeoJSON(item.siweigeomewkt, "#55A1E3", { isfly: true }, (data) => {
+              data.name = `2wentity${obj.id}`;
             });
           });
-
         }
       });
     },
@@ -151,19 +153,30 @@ export default {
         }
       });
     },
-    fly(params) {
-      console.log(params, "paramsparams");
-      console.log('fly,', '---');
+    fly() {
+      this.nowgeoId && removeGeoJSON(this.nowgeoId)
+      this.nowgeoId = 'h' + this.nowObj.data.entityid
+      this.nowObj.data.geom.forEach(item => {
+        loadGeoJSON(item.siweigeomewkt, "#ff0000", { isfly: true }, (data) => {
+          data.name = this.nowgeoId
+        });
+      });
     },
-    info(params) {
-      console.log(params, "paramsparams");
-      console.log('info', '---');
+    info() {
+      this.showinfo = true;
+      Object.keys(this.nowObj.data).forEach((key) => {
+        this.jbxxData.push({ name: key, value: this.nowObj.data[key], });
+      });
     }
   },
   watch: {
     // graphText(newValue) {
     // },
   },
+  beforeDestroy() {
+    removeGeoJSON('2wentity')
+    this.nowgeoId && removeGeoJSON(this.nowgeoId)
+  }
 };
 </script>