修改

src/components/mars3d/Map.vue

@@ -9,13 +9,13 @@
 <script>
 import Vue from 'vue'
 import { httpGet, httpPostForJson } from "@/common/httpBean.js";
-import { screenMapSetUpQuery} from "@/axios/api.js";
+import { screenMapSetUpQuery,carRealTimeLocationQuery2} from "@/axios/api.js";
 
 // 使用免费开源版本
 import 'mars3d/dist/mars3d.css'
 import * as mars3d from 'mars3d'
 import * as Cesium from 'mars3d-cesium/Build/Cesium/Cesium'
-import  { initGraphicManager,initLayerManager,bindLayerContextMenu } from './js/graphicManager'
+import  { initGraphicManager,initLayerManager,bindLayerContextMenu,bindLayerPopup } from './js/graphicManager'
 
 
 // 导入插件(其他插件类似，插件清单访问：http://mars3d.cn/dev/guide/start/install.html)
@@ -31,7 +31,7 @@ export default {
   name: 'mars3dViewer',
 
   created(){
-    this.getCoordinate();
+    
   },
 
   data(){
@@ -40,6 +40,8 @@ export default {
       toJavaCoordinates:[],
       weilanName:[],
       areaColorData:[],
+      carNumber:'',
+      shebeiName:'',  
     }
   },
 
@@ -81,6 +83,12 @@ export default {
   },
 
   methods: {
+    //获取车辆设备名和车牌号
+    getCarInforFn(carnumber,equipmentName){
+      this.carNumber = carnumber;
+      this.shebeiName = equipmentName;
+      this.getCoordinate();
+    },
     //后台获取数据
     getCoordinate() {
       let that = this;
@@ -145,6 +153,11 @@ export default {
         that.addGraphic_01(graphicLayer,item,that.weilanName[index],that.areaColorData[index]);
       })
 
+      //实时位置
+      var graphicLayer4 = new mars3d.layer.GraphicLayer();
+      map.addLayer(graphicLayer4);
+      that.addDemoGraphics(graphicLayer4);
+
       // 抛出事件
       this.$emit('onload', map)
     },
@@ -187,9 +200,9 @@ export default {
           },
           label: {
             // 不需要文字时，去掉label配置即可
-            text: "鲁A12345",
-            font_size: 16,
-            color: "#ffffff",
+            text: that.carNumber,
+            font_size: 22,
+            color: "#ff0000",
             outline: true,
             outlineColor: "#000000",
             pixelOffsetY: -20,
@@ -202,18 +215,31 @@ export default {
       graphicLayer4.addGraphic(graphic)
       // 设置动态位置
       graphicLayer4.eachGraphic((graphic) => {
-        graphic.addDynamicPosition(that.randomPoint()) // 首次出现的位置
+        graphic.addDynamicPosition(Cesium.Cartesian3.fromDegrees(117.12111, 36.679, 500)) // 首次出现的位置
       })
       graphicLayer4.eachGraphic((graphic) => {
-        graphic.addDynamicPosition(that.randomPoint(), 20) // 按20秒运动至指定位置
+        graphic.addDynamicPosition(Cesium.Cartesian3.fromDegrees(117.12111, 36.679, 500), 5) // 按5秒运动至指定位置
       })
 
       // 定时更新动态位置（setInterval为演示）
       setInterval(() => {
-        graphicLayer4.eachGraphic((graphic) => {
-          graphic.addDynamicPosition(that.randomPoint(), 20)
-        })
-      }, 20000)
+        httpGet(carRealTimeLocationQuery2,{name:that.shebeiName}).then((res) => {
+          if(res.data){
+            let jd = res.data.lon;
+            let wd = res.data.lat;
+            graphicLayer4.eachGraphic((graphic) => {
+              graphic.addDynamicPosition(Cesium.Cartesian3.fromDegrees(jd, wd, 500), 5)
+            })
+          }else{
+            let jd = 0;
+            let wd = 0;
+            graphicLayer4.eachGraphic((graphic) => {
+              graphic.addDynamicPosition(Cesium.Cartesian3.fromDegrees(jd, wd, 500), 5)
+            })
+          }
+        });
+
+      }, 5000)
     },
     // 取区域内的随机点
     randomPoint() {
@@ -221,18 +247,12 @@ export default {
       const wd = this.random(36.655207 * 1000, 36.665207 * 1000) / 1000
       console.log("jd",jd);
       console.log("wd",wd);
+      console.log(Cesium.Cartesian3.fromDegrees(jd, wd, 500));
       return Cesium.Cartesian3.fromDegrees(jd, wd, 500)
     },
     random(min, max) {
       return Math.floor(Math.random() * (max - min + 1) + min)
     },
-    //获取实时位置坐标
-    getShiShiWeiZhiZuoBiaoFn(){
-      let that = this;
-      httpGet(screenMapSetUpQuery,{size:9999}).then((res) => {
-        
-      });
-    },
     getSampledPositionProperty(points){
       let property = new Cesium.SampledPositionProperty();
       let start = this.map.clock.currentTime;

src/views/MLargeScreen/index.vue

@@ -57,7 +57,7 @@
 		<smallWindow ref="smallWindowMethod" v-show="selectFunction == 7"/>
 		<!-- 地图区域 -->
 		<div id="centerDiv" class="mapcontainer">
-			<mars3dViewerMap :url="configUrl" @onload="onMapload"/>
+			<mars3dViewerMap :url="configUrl" @onload="onMapload" ref="mars3dViewerMapMethod"/>
 		</div>
 		<!-- 电铲待装车辆列表 -->
 		<div class="waitingtrucksView" v-if="carclass == '电铲'">
@@ -178,6 +178,7 @@ export default {
 							if(res.data.totalElements == 0){
 								return
 							}else{
+								this.$refs.mars3dViewerMapMethod.getCarInforFn(this.carnumber,res.data.content[0].equipmentName);
 								this.carclass = res.data.content[0].carclass;
 								if(this.carclass == '电铲'){
 									this.loadData1();