qinhouyu 2 anos atrás
pai
commit
db122fdba2
1 arquivos alterados com 32 adições e 34 exclusões
  1. 32 34
      src/components/supermap-2.5d.vue

+ 32 - 34
src/components/supermap-2.5d.vue

@@ -3,14 +3,14 @@
     <div id="cesiumContainer" style="width: 100%; height: 100%;background: none;">
       <!--地图top 显示 开始-->
       <transition name='fade'>
-        <div className="map-tit" v-show="mapshow">
-          <div className="top-tit">
-            <i className="iconfont sj-icon-jkzx"></i>
-            <span><img src="../assets/images/close.svg" @click="mapShow"/></span>
+        <div class="map-tit" v-show="mapshow">
+          <div class="top-tit">
+            <i class="iconfont sj-icon-jkzx"></i>
+            <span><img src="../assets/images/close.svg" @click="mapShow" /></span>
           </div>
-          <div className="map-txt" v-html="bindPopupHtml">
+          <div class="map-txt" v-html="bindPopupHtml">
           </div>
-          <div id="super2"/>
+          <div id="super2" />
         </div>
       </transition>
       <!--地图top 显示 结束-->
@@ -27,7 +27,6 @@ import Cookies from 'js-cookie'
 import {
   getConfigKey
 } from "@/api/system/config";
-
 export default {
   name: 'supermap-2.5d',
   data() {
@@ -68,7 +67,7 @@ export default {
         mapData: null,
         mapName: null
       },
-      showLayer: null,
+      showLayer:null,
       clickTime: new Date().getTime(),
       cacheData: {
         ProvinceRoad: "",
@@ -201,7 +200,7 @@ export default {
   created() {
   },
   mounted() {
-    this.showLayer = this.showLayer != undefined ? this.showLayer : false;
+    this.showLayer = this.showLayer != undefined ? this.showLayer:false;
   },
   props: {
     showLayer: [Boolean],
@@ -245,18 +244,17 @@ export default {
       that.handlerDis = new Cesium.MeasureHandler(that.viewer, Cesium.MeasureMode.Distance, that.clampMode);
       that.handlerDis.clampMode = 1;
       //注册测距功能事件
-      that.handlerDis.measureEvt.addEventListener(function (result) {
+      that.handlerDis.measureEvt.addEventListener(function(result) {
         var dis = Number(result.distance);
         var selOptV = that.selOptV;
         if (selOptV == 3 || selOptV == 4) {
           dis = Number(calcClampDistance(positions));
-        }
-        ;
+        };
         var distance = dis > 1000 ? (dis / 1000).toFixed(2) + 'km' : dis.toFixed(2) + 'm';
         that.handlerDis.disLabel.text = '距离:' + distance;
 
       });
-      that.handlerDis.activeEvt.addEventListener(function (isActive) {
+      that.handlerDis.activeEvt.addEventListener(function(isActive) {
         if (isActive == true) {
           that.viewer.enableCursorStyle = false;
           that.viewer._element.style.cursor = '';
@@ -282,12 +280,12 @@ export default {
       that.handlerArea = new Cesium.MeasureHandler(that.viewer, Cesium.MeasureMode.Area, that.clampMode);
 
       that.handlerArea.clampMode = 1;
-      that.handlerArea.measureEvt.addEventListener(function (result) {
+      that.handlerArea.measureEvt.addEventListener(function(result) {
         var mj = Number(result.area);
         var area = mj > 1000000 ? (mj / 1000000).toFixed(2) + 'km²' : mj.toFixed(2) + '㎡'
         that.handlerArea.areaLabel.text = '面积:' + area;
       });
-      that.handlerArea.activeEvt.addEventListener(function (isActive) {
+      that.handlerArea.activeEvt.addEventListener(function(isActive) {
         if (isActive == true) {
           that.viewer.enableCursorStyle = false;
           that.viewer._element.style.cursor = '';
@@ -617,9 +615,9 @@ export default {
       }
 
       //开始加载专题图等数据,8秒后开始执行
-      setTimeout(function () {
-        //3.水系
-        // let shuixi = that.superMapRootUrl+withinData[2];
+      setTimeout(function() {
+        // 3.水系
+        // let shuixi = that.superMapRootUrl+"/map-mvt-shuixiMian/restjsr/v1/vectortile/maps/shuixi_Mian";
         // that.mvtMap0 = that.scene.addVectorTilesMap({
         //   url: shuixi,
         //   canvasWidth: 512,
@@ -629,8 +627,8 @@ export default {
         //   show:true,
         // });
 
-        //4.林地
-        // let lindi = that.superMapRootUrl+withinData[3];
+        // //4.林地
+        // let lindi = that.superMapRootUrl+"/map-mvt-lindi/restjsr/v1/vectortile/maps/lindi";
         // that.mvtMap1 = that.scene.addVectorTilesMap({
         //   url: lindi,
         //   canvasWidth: 512,
@@ -639,9 +637,9 @@ export default {
         //   selectedColor:new Cesium.Color(6,254,181,0.5),
         //   show:true,
         // });
-
+        //
         //5.农田
-        if (that.showLayer) {
+        if(that.showLayer){
           let nongtian = that.superMapRootUrl + withinData[4];
           that.mvtMap2 = that.scene.addVectorTilesMap({
             url: nongtian,
@@ -694,10 +692,10 @@ export default {
 
       }, 3000);
       that.viewer.selectedEntityChanged.addEventListener(function (entity) {
-        if (entity != undefined && Reflect.has(entity, 'layerID')) {
-          that.queryParams.name = entity.pickResult[entity.layerID][0].feature.properties.Name;
-          that.queryParams.mapData = entity.pickResult[entity.layerID][0].feature.properties.SmUserID;
-          that.queryParams.mapName = entity.pickResult[entity.layerID][0].feature.properties.layer;
+        if(entity != undefined && Reflect.has(entity,'layerID')){
+          that.queryParams.name  = entity.pickResult[entity.layerID][0].feature.properties.Name;
+          that.queryParams.mapData  = entity.pickResult[entity.layerID][0].feature.properties.SmUserID;
+          that.queryParams.mapName  = entity.pickResult[entity.layerID][0].feature.properties.layer;
           getDeviceList(that.queryParams).then(res => {
             const treeLabels = [{
               "id": null,
@@ -707,7 +705,7 @@ export default {
               "parentLabelCode": ""
             }];
             const labelChannels = [];
-            for (let i in res.data) {
+            for (let i in res.data){
               treeLabels.push({
                 "id": null,
                 "labelCode": res.data[i].cameraCode,
@@ -736,7 +734,7 @@ export default {
                 "labelChannels": labelChannels
               }
             ]
-            that.$emit('fatherMethod', dianshiqiang, res.data[0].longitude, res.data[0].latitude, res.data[0].userList);
+            that.$emit('fatherMethod', dianshiqiang,res.data[0].longitude,res.data[0].latitude,res.data[0].userList);
           });
         }
       });
@@ -776,7 +774,7 @@ export default {
      */
     createLeftClickDescription() {
       let that = this;
-      that.handler.setInputAction(function (movement) {
+      that.handler.setInputAction(function(movement) {
         that.pick = that.viewer.scene.pick(movement.position);
         if (that.pick && that.pick) {
           let id = Cesium.defaultValue(that.viewer.scene.pick(movement.position).id, that.viewer.scene.pick(
@@ -788,7 +786,7 @@ export default {
             that.bindPopupHtml = html
             that.mapshow = true
           } else if (html == 'cgq') {
-            that.timer = setInterval(function () {
+            that.timer = setInterval(function() {
               var color = "green";
               var value = Math.random();
               var up = "▲";
@@ -817,7 +815,7 @@ export default {
      */
     createRightClickDescription() {
       let that = this;
-      that.handler.setInputAction(function (movement) {
+      that.handler.setInputAction(function(movement) {
         that.mapshow = false
         if (new Date().getTime() - that.clickTime < 2000) {
           return
@@ -966,7 +964,8 @@ export default {
     i {
       color: #10ccff;
       font-size: 18px;
-      text-shadow: 0px 0px 5px #23b3b3;;
+      text-shadow: 0px 0px 5px #23b3b3;
+    ;
     }
 
     span img {
@@ -984,8 +983,7 @@ export default {
     line-height: 20px;
     font-size: 12px;
 
-    .d-l-con {
-    }
+    .d-l-con {}
   }
 }