添加 路径数量
This commit is contained in:
parent
5c7ee289ca
commit
3efd57d667
@ -65,7 +65,7 @@
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div id="container">
|
<div id="container">
|
||||||
<div class="fixed bg-amber-50 rounded-r z-max text-center" style="width: 300px" v-if="view.filterData.length > 0">
|
<div class="fixed bg-amber-50 rounded-br z-max text-center" style="width: 300px" v-if="view.filterData.length > 0">
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<div class="w-1/4">最高速度</div>
|
<div class="w-1/4">最高速度</div>
|
||||||
<div>{{view.speed.max}} km/h</div>
|
<div>{{view.speed.max}} km/h</div>
|
||||||
@ -75,6 +75,10 @@
|
|||||||
<div>{{view.speed.avg}} km/h</div>
|
<div>{{view.speed.avg}} km/h</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="fixed bg-amber-50 rounded-tl z-max text-center absolute-bottom-right" style="width: 300px" v-if="view.lines.length > 0">
|
||||||
|
路径数量 {{view.lines.length}}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
@ -118,7 +122,8 @@ const view = reactive({
|
|||||||
speed: {
|
speed: {
|
||||||
max: 0,
|
max: 0,
|
||||||
avg: 0
|
avg: 0
|
||||||
}
|
},
|
||||||
|
lines: [],
|
||||||
})
|
})
|
||||||
const layers = reactive({
|
const layers = reactive({
|
||||||
satellite: {
|
satellite: {
|
||||||
@ -215,7 +220,8 @@ AMapLoader.load({
|
|||||||
"AMap.HawkEye",
|
"AMap.HawkEye",
|
||||||
"AMap.ToolBar",
|
"AMap.ToolBar",
|
||||||
"AMap.ControlBar"
|
"AMap.ControlBar"
|
||||||
], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
],// 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
||||||
|
"lang": "zh_cn"
|
||||||
}).then((AMap) => {
|
}).then((AMap) => {
|
||||||
let scale = new AMap.Scale({
|
let scale = new AMap.Scale({
|
||||||
visible: true
|
visible: true
|
||||||
@ -284,6 +290,7 @@ AMapLoader.load({
|
|||||||
})
|
})
|
||||||
|
|
||||||
function clearMap(){
|
function clearMap(){
|
||||||
|
view.lines = []
|
||||||
map.remove(data.polylines)
|
map.remove(data.polylines)
|
||||||
map.remove(data.polyline)
|
map.remove(data.polyline)
|
||||||
map.remove(data.labelsLayer)
|
map.remove(data.labelsLayer)
|
||||||
@ -397,7 +404,7 @@ function drawMap(){
|
|||||||
map.add(data.labelsLayer)
|
map.add(data.labelsLayer)
|
||||||
}
|
}
|
||||||
|
|
||||||
let lines = []
|
view.lines = []
|
||||||
let prev = moment(0)
|
let prev = moment(0)
|
||||||
for (let i = 0; i < _data.length; i++) {
|
for (let i = 0; i < _data.length; i++) {
|
||||||
let datum = _data[i]
|
let datum = _data[i]
|
||||||
@ -406,17 +413,17 @@ function drawMap(){
|
|||||||
prev = datum.time
|
prev = datum.time
|
||||||
} else {
|
} else {
|
||||||
prev = datum.time
|
prev = datum.time
|
||||||
lines.push([])
|
view.lines.push([])
|
||||||
}
|
}
|
||||||
lines[lines.length -1].push(datum)
|
view.lines[view.lines.length -1].push(datum)
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log("lines", lines)
|
console.log("lines", view.lines)
|
||||||
|
|
||||||
let colorList = Array.from({ length: lines.length })
|
let colorList = Array.from({ length: view.lines.length })
|
||||||
.map(() => COLOR[Math.floor(Math.random() * COLOR.length)]);
|
.map(() => COLOR[Math.floor(Math.random() * COLOR.length)]);
|
||||||
data.polylines = []
|
data.polylines = []
|
||||||
lines.forEach((_data,index) => {
|
view.lines.forEach((_data,index) => {
|
||||||
let path = _data.map((item) => {
|
let path = _data.map((item) => {
|
||||||
return new AMap.LngLat(item.longitude, item.latitude)
|
return new AMap.LngLat(item.longitude, item.latitude)
|
||||||
})
|
})
|
||||||
|
Loading…
Reference in New Issue
Block a user