suzhou-jichuang-lanhai
/
JiangningUrbanManagePc
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

车辆行程轨迹使用假数据 车辆状态由行驶中改为未启动

Browse Source
prodLv
吕天方 3 months ago
parent f9ce658f49
commit 2a041db047
2 changed files with 156 additions and 32 deletions
Show Stats Download Patch File Download Diff File

107
src/utils/data/carTrack.json
Unescape View File

@ -0,0 +1,107 @@
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"id": 81370,
"properties": {
"_draw_type": "line"
},
"geometry": {
"type": "LineString",
"coordinates": [
[
118.79807494,
31.94347206
],
[
118.79913133,
31.93427172
],
[
118.8076934,
31.93521538
],
[
118.80850954,
31.92890365
],
[
118.81906195,
31.92842336
],
[
118.81889553,
31.93096601
],
[
118.81876239,
31.93181355
],
[
118.81892884,
31.93232207
],
[
118.81969448,
31.93316959
],
[
118.81956133,
31.93384761
],
[
118.81862926,
31.93429962
],
[
118.8179635,
31.93537313
],
[
118.81788248,
31.93900338
],
[
118.81856548,
31.94062961
],
[
118.81802194,
31.94263941
],
[
118.81879847,
31.94310067
],
[
118.82636959,
31.94316657
],
[
118.82625314,
31.94507748
],
[
118.82128337,
31.94484686
],
[
118.8077718,
31.94405614
],
[
118.7980264,
31.94349604
]
]
},
"bbox": [
118.7980264,
31.92842336,
118.82636959,
31.94507748
]
}
]
}

81
src/views/components/personagetrack/index.vue
Unescape View File

@ -24,7 +24,8 @@
<div class="item"> <div class="item">
<div class="ball"></div> <div class="ball"></div>
<div class="content"> <div class="content">
当前状态：<span>{{ person ? personItem.status == '1' ? '在线' : personItem.status == '0' ? '离线' : '' : "行驶中" }}</span> <!-- 当前状态：<span>{{ person ? personItem.status == '1' ? '在线' : personItem.status == '0' ? '离线' : '' : "行驶中" }}</span> -->
当前状态：<span>{{ person ? personItem.status == '1' ? '在线' : personItem.status == '0' ? '离线' : '' : "未启动" }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -122,6 +123,7 @@ import ThreeGJ02 from "@/utils/mapJson/3GJ02.json";
import FourGJ02 from "@/utils/mapJson/4GJ02.json"; import FourGJ02 from "@/utils/mapJson/4GJ02.json";
import kaifaqu from "@/utils/mapJson/开发区空港开发区GJ02.json"; import kaifaqu from "@/utils/mapJson/开发区空港开发区GJ02.json";
import ruanjianyuan from "@/utils/mapJson/开发区软件园GJ02.json"; import ruanjianyuan from "@/utils/mapJson/开发区软件园GJ02.json";
import carTrackJson from "@/utils/data/carTrack.json"
// import L from "leaflet"; // import L from "leaflet";
// import "@/utils/lib/leaflet.ChineseTmsProviders.js"; // import "@/utils/lib/leaflet.ChineseTmsProviders.js";
// import "@/utils/lib/leaflet-tilelayer-colorizr.js"; // import "@/utils/lib/leaflet-tilelayer-colorizr.js";
@ -343,7 +345,6 @@ export default {
this.query(); this.query();
} else { } else {
this.carItem = item; this.carItem = item;
console.log(this.carItem);
this.queryTime.fromTime = this.getCurrentTime(); this.queryTime.fromTime = this.getCurrentTime();
this.queryTime.toTime = this.getCurrentTime(1); this.queryTime.toTime = this.getCurrentTime(1);
this.title = "车辆行程轨迹"; this.title = "车辆行程轨迹";
@ -439,6 +440,7 @@ export default {
if(this.map.getAllOverlays('polyline')) { if(this.map.getAllOverlays('polyline')) {
this.map.remove(this.map.getAllOverlays('polyline')); this.map.remove(this.map.getAllOverlays('polyline'));
} }
console.log(arr,"arr");
this.track = new AMap.Polyline({ this.track = new AMap.Polyline({
path: arr, path: arr,
strokeWeight: 6, strokeWeight: 6,
@ -462,37 +464,52 @@ export default {
} }
}) })
} else { } else {
carTrack({startTime:this.queryTime.fromTime,endTime:this.queryTime.toTime,deviceIndexCode:"b91155244ea245708ed8258dfcc4509a"}).then(res=>{ // carTrack({startTime:this.queryTime.fromTime,endTime:this.queryTime.toTime,deviceIndexCode:"b91155244ea245708ed8258dfcc4509a"}).then(res=>{
// console.log(res,"经纬度"); // // console.log(res,"经纬度");
this.loading = false; // this.loading = false;
if(res.code == 200) { // if(res.code == 200) {
let arr = [] // let arr = []
res.data.records.forEach(element => { // res.data.records.forEach(element => {
let arrTwo = []; // let arrTwo = [];
arrTwo[1] = element.latitude; // arrTwo[1] = element.latitude;
arrTwo[0] = element.longitude; // arrTwo[0] = element.longitude;
arr.push(arrTwo); // arr.push(arrTwo);
}); // });
// if(this.track) { // // if(this.track) {
// this.globalMap.removeLayer(this.track); // // this.globalMap.removeLayer(this.track);
// } // // }
if(this.map.getAllOverlays('polyline')) { // if(this.map.getAllOverlays('polyline')) {
this.map.remove(this.map.getAllOverlays('polyline')); // this.map.remove(this.map.getAllOverlays('polyline'));
} // }
this.track = new AMap.Polyline({ // this.track = new AMap.Polyline({
path: arr, // path: arr,
strokeColor: '#F44444', // strokeColor: '#F44444',
strokeOpacity: 1, // strokeOpacity: 1,
showDir: true, // showDir: true,
}) // })
this.map.add(this.track); // this.map.add(this.track);
const mapInstance = this.$refs.personMap.$$getInstance(); // const mapInstance = this.$refs.personMap.$$getInstance();
// 调用 setFitView 方法居中和缩放地图以适应 GeoJSON 数据 // // 调用 setFitView 方法居中和缩放地图以适应 GeoJSON 数据
mapInstance.setFitView(this.track); // mapInstance.setFitView(this.track);
} // }
}).catch(err => { // }).catch(err => {
this.loading = false; // this.loading = false;
// })
let arr = carTrackJson.features[0].geometry.coordinates;
if(this.map.getAllOverlays('polyline')) {
this.map.remove(this.map.getAllOverlays('polyline'));
}
this.track = new AMap.Polyline({
path: arr,
strokeColor: '#F44444',
strokeOpacity: 1,
showDir: true,
}) })
this.map.add(this.track);
const mapInstance = this.$refs.personMap.$$getInstance();
// 调用 setFitView 方法居中和缩放地图以适应 GeoJSON 数据
mapInstance.setFitView(this.track);
this.loading = false;
} }
} }
}, },

Write Preview
Loading…
Cancel
Save