cte-share/components/weizhimap/weizhimap.nvue

<template>
	<view>
		<web-view class="mapbody" :src="webUrl"></web-view>
	</view>
</template>

<script>
	import api from "@/pages/api/api.js"
	export default {
		name:"weizhimap",
		props:{
			covers:'',
			height:0
		},
		data() {
			return {
				webUrl: '',
				latitude:0,
				longitude:0,
				marker:'',
				markImage:'/static/images/dizhil@3x.png',
			};
		},
		onReady() {
			
		},
		watch:{
			covers(val){
				console.log('-----',val);
				this.markImage = val[0].iconPath;
				if(val[1]){
					this.webUrl = '/hybrid/html/maps/mapindex.html?sstate=0&&lat=' + val[0].latitude + '&lng=' + val[0].longitude+'&nlng='+val[1].longitude+'&nlat='+val[1].latitude;
				}
				else{
					this.webUrl = '/hybrid/html/maps/mapindex.html?sstate=0&&lat=' + val[0].latitude + '&lng=' + val[0].longitude+'&nlng=0&nlat=0';
				}
				console.log(this.webUrl)
				
			}
		},
		methods:{
			
			setLocat(latitude,longitude,f,t){
				this.latitude=latitude;
				this.longitude = longitude;
				this.marker=[{
					id:1,//控件id
					latitude: this.latitude,
					longitude: this.longitude,
					iconPath: this.markImage
				}];
				console.log(this.marker);
				return;
				var latlng = longitude+','+latitude;
				
				api('setLocat',{
					latlng:latlng,
					from:f,
					to:t
				},res=>{
					this.latitude=res.data.data.result[0].y;
					this.longitude = res.data.data.result[0].x;
					this.marker=[{
						latitude: this.latitude,
						longitude: this.longitude,
						iconPath: this.markImage
					}];
				},failc=>{
					//console.log('getadvertis----',failc)
				})
			},
		}
	}
</script>

<style>
	.mapbody{
		width: 750upx;
		height: 500rpx;
		background-color: aquamarine;
	}

</style>