【uni-app】配合map组件定位“我的位置”显示到地图上

如果想在微信小程序中通过getLocation获取位置，显示地址详情，必须调用腾讯地图开放平台中的微信小程序JavaScript SDK地图版本，按照下面的步骤完成SDK的调用，

1. 注册并登陆腾讯地图开放平台，网址https://lbs.qq.com
2. 申请开发者密钥，申请地址：https://lbs.qq.com/dev/console/application/mine 添加应用时要勾选“WebServiceAPI”复选框
3. 下载微信小程序JavaScript SDK，下载地址：https://mapapi.qq.com/web/miniprogram/JSSDK/qqmap-wx-jssdk1.2.zip 下载完后解压，找到qqmap-wx-jssdk1.2文件夹，将其重命名为qqmap-wx-jssdk，复制到static/js/utils文件夹下
4. 设置安全域名，登录微信小程序管理后台，设置地址：https://mp.weixin.qq.com，在左侧导航栏中单击“开发”按钮，进入开发主页面，单击“开发管理”按钮，然后单击“开发设置”按钮，在此页面中找到服务器域名，在服务器域名下有request合法域名，在该域名中添加https://apis.map.qq.com
5. 在代码中调用该API

使用getLocation配合map组件，可以将“我的位置”显示在地图上，代码如下：

<template>
	<view>
		<map class="map" :latitude="latitude" :longitude="longitude" :markers="markers">
		</map>
	</view>
</template>
<script>
	export default{
		name: "loocation",
		data(){
			return {
				latitude:"", // 维度
				longitude:"", // 经度
				markers:[
					{
						latitude:"",
						longitude:"",
						iconPath:"../../static/images/my.png",
						width:"30",
						height:"30"
					}
				]
			}
		},
		onLoad(){
			uni.getLocation({
				type:'gcj02',
				success:(res)=>{
					this.latitude = res.latitude;
					this.longitude= res.longitude;
					// 将获取的值赋值给markers
					this.markers[0].latitude  = this.latitude
					this.markers[0].longitude= this.longitude
				}
			})
		}
	}
</script>

map组件的makers代表标记点用于在地图上显示标记的位置，值是一个数组类型，可以有多个标记