👍 增加地图增加拼多多

2023-11-24 18:58:56 +08:00
parent 7f4aecb936
commit 3a33d65d6b
26 changed files with 2330 additions and 256 deletions
@@ -1,57 +1,82 @@
 <template>
-  <map
-    id="map"
-    :longitude="map.longitude"
-    :latitude="map.latitude"
-    :markers="mapConfig"
-    scale="15"
-    show-location
-    style="width: 100%; height: 100%;"
-  ></map>
+	<map id="map" :longitude="map.longitude" :latitude="map.latitude" :markers="mapConfig" scale="12" show-location
+		@regionchange="test" style="width: 100%; height: 100%;"></map>
 </template>
 <script>
-export default {
-  name: "Index",
-  components: {},
-  props: {},
-  data: function() {
-    return {
-      mapConfig: {
-        latitude: "",
-        longitude: "",
-        name: "",
-        address: ""
-      },
-      map: {
-        latitude: "",
-        longitude: ""
-      }
-    };
-  },
-  onShow: function() {
-    this.map = {
-      latitude: this.$yroute.query.latitude,
-      longitude: this.$yroute.query.longitude
-    };
-    this.mapConfig = [{
-      id: 1,
-      width: 50,
-      height: 50,
-      iconPath: this.$yroute.query.image,
-      latitude: this.$yroute.query.latitude,
-      longitude: this.$yroute.query.longitude,
-      title: this.$yroute.query.name,
-      name: this.$yroute.query.name,
-      address: this.$yroute.query.detailedAddress
-    }];
-    console.log(this.mapConfig);
-  },
-  methods: {}
-};
+	import {
+		getFishIndex,
+		getFishPlaceInfo
+	} from '@/api/fish'
+
+	export default {
+
+		name: "Index",
+		components: {},
+		props: {},
+		data: function() {
+			return {
+				mapConfig: [],
+				map: {
+					latitude: 30.579150542191858,
+					longitude: 114.31590683471099
+				},
+			};
+		},
+		onShow: function() {
+			
+			this._mapContext = uni.createMapContext("map", this);
+			this._mapContext.moveToLocation()
+
+			let that = this;
+			
+			// uni.getLocation({
+			// 	success(localtionRs) {
+			// 		that.refresh(localtionRs);
+			// 	},
+			// })
+		},
+		methods: {
+			test(res) {
+				console.log("res",res)
+				let that = this;
+				if (res.type == "end") {
+					console.log(this._mapContext)
+					this._mapContext.getCenterLocation({
+						success(res){
+							that.refresh(res)
+						}
+					})
+				}
+			},
+			refresh(location){
+				let that = this;
+				getFishIndex(location).then(res => {
+					console.log(res.data)
+					if (res.data) {
+						res.data.forEach(e => {
+							// 需要判断不存在对应标点才继续新增,另外太近标点需要做marker聚合
+							// 性能：可以考虑把之前增加的删掉（如果页面上标点太多）
+							that.mapConfig.push({
+								alpha: .8,
+								height: 30,
+								width: 30,
+								id: e.id,
+								name: e.placeName,
+								latitude: Number(e.latitude),
+								longitude: Number(e.longitude),
+								iconPath: e.mode == 0 ? "/static/public_fish.png" :
+									"/static/business_fish.png"
+							})
+						})
+					}
+				})
+			},
+		}
+	};
 </script>
-<style  lang="less">
-page {
-  width: 100%;
-  height: 100%;
-}
-</style>
+<style lang="less">
+	page {
+		width: 100%;
+		height: 100%;
+	}
+</style>