Shikong/sk-matrix-project
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

支持动态筛选路线

Browse Source
This commit is contained in:
Shikong 2023-05-18 15:56:43 +08:00
parent a26a5ef8af
commit 76dcedce51
2 changed files with 37 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
frontend/matrix-middle-service-web/src/views/record/AMapLocation.vue
View File

@ -118,6 +118,7 @@ import {
} from "matrix-middle-service-web/src/views/record/logic/login";
import {fixedLocationHandler} from "matrix-middle-service-web/src/views/record/logic/location";
import {drawMarkers} from "matrix-middle-service-web/src/views/record/logic/markers";
import {drawLines} from "matrix-middle-service-web/src/views/record/logic/lines";
const $q = useQuasar();
const scrollArea = reactive({
thumbStyle: {
@ -135,7 +136,6 @@ const scrollArea = reactive({
opacity: "0.2"
}
})
let canvasDir = createCanvasDir();
function login(){
loginRequest(authModel).finally(()=>{
@ -157,7 +157,6 @@ const feature = reactive({
let map = {}
const data = {
data: [],
polyline: {},
polylines: [],
fixedPolyline: {},
labelsLayer: null,
@ -249,7 +248,10 @@ function toggleTraffic() {
}
function changeShowLines(){
console.log("options.showLines",options.showLines)
console.log("view.lines",view.lines)
drawMarkers(map,data,options,view.lines.filter((_,index)=>options.showLines.includes(index)))
drawLines(map,data,view.lines.filter((_,index)=>options.showLines.includes(index)))
}
AMapLoader.load({
@ -332,7 +334,6 @@ AMapLoader.load({
function clearMap(){
view.lines = []
map.remove(data.polylines)
map.remove(data.polyline)
map.remove(data.markers)
map.remove(data.infoWindow)
}
@ -388,39 +389,8 @@ function drawMap(autoSelect=false){
console.log("lines", view.lines)
drawMarkers(map,data,options,view.lines.filter((_,index)=>options.showLines.includes(index)))
drawLines(map,data,view.lines.filter((_,index)=>options.showLines.includes(index)))
let colorList = randomColorList(view.lines.length)
data.polylines = []
view.lines.forEach((_data,index) => {
let path = _data.map((item) => {
return new AMap.LngLat(item.longitude, item.latitude)
})
let polyline = new AMap.Polyline({
path: path,
showDir: true,
dirImg: canvasDir,
borderWeight: 6, // 线条宽度，默认为 1
strokeWeight: 6,
strokeOpacity: 0.9, // 透明度
strokeColor: colorList[index], // 线条颜色
dirColor: 'white',
lineJoin: 'round' // 折线拐点连接处样式})
})
data.polylines.push(polyline)
})
console.log("polylines",data.polylines)
// polyline = new AMap.Polyline({
// path: path,
// showDir: true,
// dirImg: canvasDir,
// borderWeight: 6, // 线条宽度，默认为 1
// strokeWeight: 6,
// strokeColor: 'red', // 线条颜色
// dirColor: 'white',
// lineJoin: 'round' // 折线拐点连接处样式})
// })
map.add(data.polylines)
setTimeout(()=>{
if(!options.autoScaling){
return

32
frontend/matrix-middle-service-web/src/views/record/logic/lines.ts Normal file
View File

@ -0,0 +1,32 @@
import {randomColorList} from "matrix-middle-service-web/src/views/record/logic/color";
import {createCanvasDir} from "matrix-middle-service-web/src/views/record/logic/icon";
const canvasDir = createCanvasDir();
export function drawLines(map,data,lines){
map.remove(data.polylines)
data.polylines = []
let colorList = randomColorList(lines.length)
lines.forEach((_data,index) => {
let path = _data.map((item) => {
return new AMap.LngLat(item.longitude, item.latitude)
})
let polyline = new AMap.Polyline({
path: path,
showDir: true,
dirImg: canvasDir,
borderWeight: 6, // 线条宽度，默认为 1
strokeWeight: 6,
strokeOpacity: 0.9, // 透明度
strokeColor: colorList[index], // 线条颜色
dirColor: 'white',
lineJoin: 'round' // 折线拐点连接处样式})
})
data.polylines.push(polyline)
})
console.log("polylines",data.polylines)
map.add(data.polylines)
}