<template>
	<view class="divmap" :style="{height:mHeight}">
		<view>{{mapprops.longitude}}</view>
		<map id="map" style="width: 100%;height: 100%;" :latitude="mapprops.latitude" :longitude="mapprops.longitude" 
		@tap="onMapTap"/>
	</view>
</template>
<script setup>
	import QQMapWX from "qqmap-wx-jssdk";
	import {
		onMounted,
		ref
	} from "vue";
	const props=defineProps([{
		"mHeight":{default:"100vh"}, //地图高度
		mapprops:{
			longitude:"",
			latitude:""
		}
	}]);
	
	const oWin = this;
	
	const onMapTap=(e)=>{
		
	}

	//定位
	const setMapLoalcation=(success,fail)=>{
		uni.getLocation({
			type: 'gcj02', // 返回可以用于 wx.openLocation 的经纬度
			geocode: true,
			success(res) {
				success( res);
			},
			fail(res){
				if(fail) fail(res);
			}
		});
	}

	//逆解析地址
	const mapreverseGeocoder = (longitude,latitude,success,fail) => {
		qqmapsdk.reverseGeocoder({
			location: {
				latitude: latitude,
				longitude: longitude
			},
			success: (res) => {
				if(success) success(res.result);
			},
			fail: (res) => {
				if(fail) success(fail);
			}
		})
	}
	
	//打点
	
	defineExpose({setMapLoalcation,mapreverseGeocoder});
</script>
<style scoped>
	@import url("map-view.css");
</style>
<!-- <template>
	<view style="width: 100%;height: 100vh;">
		<view></view>
		<map class="map" :scale="scale?scale:d_scale" :longitude="longitude?longitude:d_longitude" :latitude="latitude?latitude:d_latitude"></map>
		
	</view>
</template>

<script setup>
	import QQMapWX from "qqmap-wx-jssdk";
	import { onMounted } from "vue";
	import {getLoalcation} from "@/utils/map.js";

	const props = defineProps(["scale", "longitude", "latitude"]);
	let d_scale="13";
	let d_longitude="";
	let d_latitude="";
	
	onMounted(()=>{
		//获取当前定位
		getLoalcation((res)=>{
			const{latitude:lat,longitude:lng}=res
			d_longitude=lat;
			d_latitude=lng;
		});
	})
	var qqmapsdk = new QQMapWX({
		key: 'BECBZ-EJIEQ-LUU5N-B5ISQ-3TLMZ-BXFLG' // 必填
	});

	//逆解析地址
	const reverseGeocoder = (longitude,latitude,success,fail) => {
		qqmapsdk.reverseGeocoder({
			location: {
				latitude: latitude,
				longitude: longitude
			},
			success: (res) => {
				if(success) success(res.result);
			},
			fail: (res) => {
				if(fail) success(fail);
			}
		})
	}

	//可调用方法
	defineExpose({
		reverseGeocoder
	});
</script>

<style>
	@import url("map-view.css");
</style> -->