From 6069325e1a37cf0462afda1627d4c660735dc57e Mon Sep 17 00:00:00 2001
From: suerprisePlus <15810472099@163.com>
Date: 星期二, 16 七月 2024 09:51:56 +0800
Subject: [PATCH] 版本更新
---
src/views/mapView/mapView.vue | 79 ++++++++++++++++++++++++++++++++++++---
1 files changed, 73 insertions(+), 6 deletions(-)
diff --git a/src/views/mapView/mapView.vue b/src/views/mapView/mapView.vue
index 01ba591..d5bc224 100644
--- a/src/views/mapView/mapView.vue
+++ b/src/views/mapView/mapView.vue
@@ -1,5 +1,13 @@
<template>
<div id="sdkContainer" class="mapView">
+ <div class="mapLenged" v-if="$store.state.showLenged">
+ <ul>
+ <li v-for="(item, key) in lengedList" :key="key">
+ <div class="mapcolor" :style="getBackgroundColor(item)"></div>
+ <div class="mapTitle">{{ item.name }}</div>
+ </li>
+ </ul>
+ </div>
<div class="infoBox" v-show="errInfoFlag">
<div id="inforMessage"></div>
<div class="infoBottom">
@@ -19,7 +27,29 @@
data() {
return {
errInfoMessage: null,
- errInfoFlag: false
+ errInfoFlag: false,
+ lengedList:[
+ {
+ name: "鍐涗簨鐩爣",
+ color: "#73afff"
+ },
+ {
+ name: "鏀挎不鐩爣",
+ color: "#fffd72"
+ },
+ {
+ name: "缁忔祹鐩爣",
+ color: "#fabc56"
+ },
+ {
+ name: "绀句細鐩爣",
+ color: "#272424"
+ },
+ {
+ name: "姘戝畢",
+ color: "#979696"
+ }
+ ]
};
},
computed: {
@@ -35,9 +65,12 @@
}
},
methods: {
+ getBackgroundColor(res) {
+ return `background-color: ${res.color};`
+ },
setMapViewStart() {
mapView.initMap();
-
+
},
setErrorMessage(res) {
this.errInfoMessage = res;
@@ -53,10 +86,7 @@
type: "erroInfo",
value: obj.val
});
- mapServer.addServer({
- sourceType: "tms",
- url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"
- });
+
}
this.$nextTick(() => {
this.errInfoFlag = false;
@@ -78,6 +108,39 @@
height: 100%;
position: absolute;
}
+
+.mapLenged {
+ position: absolute;
+ z-index: 40;
+ border: 1px solid #808080;
+ background: rgba(255, 255,255, .7);
+ padding: 4px;
+ bottom: 20px;
+ left: 20px;
+ border-radius: 10px;
+ /* color: gray; */
+}
+
+.mapLenged .mapTitle {
+ display: flex;
+ align-items: center;
+ margin-left: 10px;
+ font-size: 16px;
+
+}
+
+.mapLenged li {
+ list-style-type: none;
+ display: flex;
+ line-height: 20px;
+ margin: 10px;
+}
+
+.mapLenged .mapcolor {
+ width: 60px;
+ height: 30px;
+}
+
.infoBox {
left: 50%;
top: 50%;
@@ -92,13 +155,16 @@
color: white;
transform: translate(-50%, -50%);
}
+
.infoBottom {
margin-top: 10px;
float: right;
}
+
.infoBottom :first-child {
margin-right: 10px;
}
+
.infoBottom button {
width: 50px;
@@ -118,6 +184,7 @@
font-size: 16px;
line-height: 30px;
}
+
.infoCount {
font-size: 14px;
line-height: 30px;
--
Gitblit v1.9.3