hjq/aircraft-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

地图组件，折线添加点击查看经纬度弹窗

Browse Source
This commit is contained in:
Double-_-Z 2025-10-20 11:53:42 +08:00
parent a1df8eb486
commit 2d5a90da0f
1 changed files with 19 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/views/order/loadOrder/loadOrderDetail/index.vue
View File

@ -165,7 +165,7 @@
<bm-scale anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-scale> <bm-scale anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-scale>
<bm-map-type :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']" anchor="BMAP_ANCHOR_TOP_LEFT"></bm-map-type> <bm-map-type :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']" anchor="BMAP_ANCHOR_TOP_LEFT"></bm-map-type>
<bm-polyline :path="trackItem.tracks" stroke-color="#0091ff" :stroke-opacity="0.8" <bm-polyline :path="trackItem.tracks" stroke-color="#0091ff" :stroke-opacity="0.8"
:stroke-weight="2" :strokeWeight="6"></bm-polyline> :stroke-weight="2" :strokeWeight="6" @click="toShowPolyline"></bm-polyline>
<bm-marker <bm-marker
v-if="trackItem.startDot" v-if="trackItem.startDot"
:position="trackItem.startDot" :position="trackItem.startDot"
@ -179,8 +179,9 @@
:show="trackItem.showStartInfo" :show="trackItem.showStartInfo"
@close="trackItem.showStartInfo=false" @close="trackItem.showStartInfo=false"
@open="trackItem.showStartInfo=true" @open="trackItem.showStartInfo=true"
title="起点："
> >
起点：（{{ trackItem.startDot.lat+'，'+trackItem.startDot.lng }}） （{{ trackItem.startDot.lat+'，'+trackItem.startDot.lng }}）
</bm-info-window> </bm-info-window>
</bm-marker> </bm-marker>
<bm-marker <bm-marker
@ -196,13 +197,14 @@
:show="trackItem.showEndInfo" :show="trackItem.showEndInfo"
@close="trackItem.showEndInfo=false" @close="trackItem.showEndInfo=false"
@open="trackItem.showEndInfo=true" @open="trackItem.showEndInfo=true"
title="终点："
> >
终点：（{{ trackItem.endDot.lat+'，'+trackItem.endDot.lng }}） （{{ trackItem.endDot.lat+'，'+trackItem.endDot.lng }}）
</bm-info-window> </bm-info-window>
</bm-marker> </bm-marker>
<!-- <bml-lushu <bm-info-window :position="polyline" title="经纬度：" :show="showPolyline" @close="showPolyline=false" @open="showPolyline=true">
:path="trackItem.tracks" :icon="icon" play rotation> （{{ polyline.lng+'，'+polyline.lat }}）
</bml-lushu> --> </bm-info-window>
</baidu-map> </baidu-map>
<div class="route-info"> <div class="route-info">
<span>飞行时长：{{ trackItem.time }}</span> <span>飞行时长：{{ trackItem.time }}</span>
@ -277,7 +279,9 @@ export default {
url: 'http://api.map.baidu.com/library/LuShu/1.2/examples/car.png', url: 'http://api.map.baidu.com/library/LuShu/1.2/examples/car.png',
size: {width: 52, height: 26}, size: {width: 52, height: 26},
opts: {anchor: {width: 27, height:13}} opts: {anchor: {width: 27, height:13}}
} },
showPolyline: false,
polyline: {},
} }
}, },
created() { created() {
@ -432,8 +436,7 @@ export default {
const distance = R * c; // 距离，单位为米 const distance = R * c; // 距离，单位为米
return distance; return distance;
}, }, // 设置飞行时间
// 设置飞行时间
setTrackTime(createTimeEnd) { setTrackTime(createTimeEnd) {
const tracks = this.trackItem.tracks; const tracks = this.trackItem.tracks;
if (tracks.length === 1) { if (tracks.length === 1) {
@ -480,6 +483,13 @@ export default {
} }
return result; return result;
}, },
// 点击折线轨迹
toShowPolyline(e){
if(e.point){
this.polyline = e.point;
this.showPolyline = true;
}
},
handleApiClick(type) { handleApiClick(type) {
// 跳转到对应的API模块 // 跳转到对应的API模块
console.log('跳转到API模块:', type) console.log('跳转到API模块:', type)