yicangzongtai_app_240321/pages/research/homepage/map.nvue

<template>
	<view>
		<map id="map1" :scale="1" ref="map1" style="width: 100%; height: 600rpx;" :latitude="latitude" :longitude="longitude" :markers="markers" :enable-zoom="true"></map>
		</view>
</template>

<script>
export default {
	props: {
		list: {
			type: Array,
			default: []
		}
	},
	data() {
		return {
			latitude: null,
			longitude: null,
			mainmap: null,
			markers: [],
			imgUrl: this.$mConfig.staticUrl
		};
	},
	computed: {},
	watch: {
		list(n) {
			if (n) {
				this.getMap();
			}
		}
	},
	created() {
		this.mainmap = uni.createMapContext('map1', this);
	},
	onShow() {},
	methods: {
		getMap() {
			let that = this
			this.longitude = this.list[0].tx_longitude;
			this.latitude = this.list[0].tx_latitude;
			let markers = [];
			this.list.forEach((val, index) => {
				markers.push({
					id: index,
					latitude: Number(val.tx_latitude),
					longitude: Number(val.tx_longitude),
					iconPath: that.imgUrl+'/map.png',
					width: 20,
					height: 20
				});
			});
			this.markers = markers;
		}
	}
};
</script>

<style></style>