uniapp使用getFuzzyLocation并解析经纬度

这篇具有很好参考价值的文章主要介绍了uniapp使用getFuzzyLocation并解析经纬度。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

不常用到,所以记录下怕忘记。

使用getFuzzyLocation需在微信后台开发管理中提前开通相应的位置服务,并且需要配置服务器域名https://apis.map.qq.com,否则无法正常使用。

1.qqmap-wx-jssdk.js下载

        微信小程序JavaScript SDK | 腾讯位置服务

        uniapp使用getFuzzyLocation并解析经纬度,uni-app,微信小程序,小程序,javascript,前端

2.页面内引入

<script>
    var QQMapWX = require("@/static/lib/util/qqmap-wx-jssdk.js");
    var qqmapsdk;
</script>

3.腾讯位置服务后台申请key,申请成功后即可使用

    export default {
        onLoad() {
            wx.authorize({
			    scope: 'scope.userFuzzyLocation',
			    success(res) {
			        if(res.errMsg == 'authorize:ok'){
			            wx.getFuzzyLocation({
			                type: 'wgs84',
			                success(res) {
								qqmapsdk = new QQMapWX({
									key: "******", 
								});
								qqmapsdk.reverseGeocoder({
									location: {
										latitude: res.latitude,
										longitude: res.longitude,
									},
									success: (addressRes) => {
										console.log(addressRes);
									},
									fail: res => {
										wx.showToast({
											title: '获取定位失败,请先开启手机定位!',
											icon: "none",
											duration: 2000,
										})
									}
								});
			                }
			            })
			        }
			    },
			    fail(err) {
			        console.log(err)   
			    }                    
			})
        }
    }

4.manifest.json需添加以下内容,否则无法使用。

uniapp使用getFuzzyLocation并解析经纬度,uni-app,微信小程序,小程序,javascript,前端文章来源地址https://www.toymoban.com/news/detail-532563.html

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

到了这里,关于uniapp使用getFuzzyLocation并解析经纬度的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uniapp微信小程序uni.getLocation获取位置(经纬度)之逆地址解析获取城市信息

    前言: 我好像隐隐约约的记得前几个月用uniapp开发微信小程序使用API接口uni.getLocation好像能获取到城市信息,但是现在只能获取到经度、纬度了,然后去看了一下uniapp官网发现仅App端支持......好吧!那可能是我记错了,也没关系,竟然能获取到经度和纬度那我们就使用第三方

    2024年02月10日
    浏览(57)
  • uniapp之使用map组件显示接收过来的经纬度

    目录 前言 效果图 提示 总代码 分析 1.显示自己位置的属性 2.markers 点标记 由于项目的需求,我需要从主页面接收经纬度,并渲染至地图上面,同时呢,也要在该位置上显示图标标记点(红色),与此同时也要显示自己位置(蓝色点),这个简单的功能就不需要使用高德地图

    2024年02月13日
    浏览(35)
  • uni-app如何获取位置信息(经纬度)

    提示:这里可以添加本文要记录的大概内容: 在实际项目中很多时候我们需要获取设备的位置信息,去展示给客户,或者以位置信息为参数,继续向服务器获取一些数据。接下来以uni-app小程序项目为例来介绍获取位置信息的思路 提示:以下是本篇文章正文内容,下面案例可

    2024年02月11日
    浏览(53)
  • uni-app获取位置信息(经纬度转换地址信息)

    1.使用uni.getLocation()获取位置信息 2.下载qqmap-wx-jssdk.js插件插件下载地址 3.使用腾讯位置服务器对经纬度进行一个地址信息转换(自己创建一个应用即可) 全都勾选上 4.注意!!关键之处!! 一定要在微信公众号平台上 服务器配置 apis.map.qq.com 上代码 template js 效果图 不当之处望

    2024年02月13日
    浏览(48)
  • 微信小程序使用TS+腾讯位置API,输入地址,解析经纬度(全局封装及调用)

    我们有时候做小程序时需要用到获取地址的经纬度,腾讯位置提供了相关API,我们可以使用其API进行调用实现功能。 1. 登录腾讯位置服务网址 腾讯位置服务 - 立足生态,连接未来 腾讯位置服务为各类应用厂商和开发者提供领先的LBS服务和解决方案;有针对Web应用的JavaScrip

    2024年02月16日
    浏览(44)
  • uniapp 在app中获取经纬度

    在uniapp中app端,uni.getLocation获取经纬度会有大概1-2公里的偏差,在实际项目中,有的需求对经纬度的准确度要求比较严格,研究了很多种方式,最终发现使用高德地图api的微信小程序的插件获取的准确性是最准的,偏差最小的。 1.先去高德地图获取key,注意,这里是要获取微

    2024年02月15日
    浏览(46)
  • 前端Vue腾讯地图SDK Api经纬度解析为地址信息Geocoding 可用于定位经纬度信息解析为地址

    前端Vue腾讯地图SDK Api经纬度解析为地址信息Geocoding 可用于定位经纬度信息解析为地址, 下载完整代码请访问uni-app插件市场地址:https://ext.dcloud.net.cn/plugin?id=13311 效果图如下: 使用方法 HTML代码实现部分

    2024年02月11日
    浏览(51)
  • uniapp通过ip获取其地址、经纬度、详细地址:

    1.方法: 查看ip内容:http://pv.sohu.com/cityjson?ie=utf-8 【1】js获取ip地址: 【2】uni-app获取ip地址:(此方法会跨域报错=后续找到解决方法再补充) 【3】使用H5自带的获取位置 【4】使用百度地图获取位置 【5】微信js-sdk自带的API 2.案例: 3.最终效果:

    2024年02月12日
    浏览(43)
  • uniapp微信小程序getLocation获取经纬度报错

    uniapp开发微信小程序时,需要做一个授权位置信息的需求,使用getLocation获取用户当前的经纬度。期间遇到了一个问题老是报这个错误:“getLocation:fail the api need to be declared in the requiredPrivateInfos field in app.json/ext.json” 根据官方文档 https://developers.weixin.qq.com/miniprogram/dev/api/loc

    2024年02月13日
    浏览(58)
  • uniapp结合Canvas+renderjs根据经纬度绘制轨迹(二)

    ​ 根据官方建议要想在 app-vue 流畅使用 Canvas 动画,需要使用 renderjs 技术,把操作 canvas 的js逻辑放到视图层运行,避免逻辑层和视图层频繁通信。 这里呢结合 renderjs 技术实现绘制轨迹图形。 你可能需要先了解 renderjs 如何数据通讯:renderjs 与 app-vue之间数据交互 html中使用

    2024年02月11日
    浏览(40)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包