uni微信小程序,打开地图,跳转第三方

4 篇文章 0 订阅
4 篇文章 0 订阅

一、需求

微信小程序 需要点击并跳转第三方地图软件导航,并计算到目标位置距离

二、思路

思路:

1.接口返回需要有位置的经纬度,这个自行在后台编辑获取

2.需要获取用户的位置权限

我这边使用的是uniapp,需要使用官方封装两个接口(主要是用1 2接口即可):

1.获取用户位置接口:uni.getLocation(OBJECT) | uni-app官网

2.打开位置接口:uni.openLocation(OBJECT) | uni-app官网

3.选择位置:uni.getLocation(OBJECT) | uni-app官网

三、具体实现:

1.需要在manifest.json 文件添加获取权限配置(使用源码视图方式打开):

代码

		"permission": {
			"scope.userLocation": {
				"desc": "你的位置信息将用于小程序位置接口的效果展示"
			}
		},
		"requiredPrivateInfos": ["getLocation", "chooseLocation"]

 2.具体代码

我这边方式是:getLocation放在onLoad方法里面 进入的时候让用户授权,授权后获得用户的经纬度以及地址信息。

ps:我这边使用当前的位置信息 是用来计算跟接口返回的目标位置信息的距离长度的

			//得到用户位置经纬度 以及授权
			getLocation(){
				var that = this
				uni.getLocation({
					success(res) {
						that.location.lat = res.latitude
						that.location.log = res.longitude
					}
					,
					fail(res){
						console.info("fail" + res)
					}
				});
			},

打开地图方法:必须先授权

this.dataInfo 对象是我后台返回的数据

			//打开地图
            openmap(){
				uni.openLocation({
					latitude: this.dataInfo.latitude,
					longitude: this.dataInfo.longitude,
					name: this.dataInfo.name,
					address: this.dataInfo.position
				})
			},

效果展示:

微信开发工具效果

真机效果:

点击右下角跳转第三方

  • 3
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值