3.关于微信小程序地理位置方面的问题以及解决方案

1.如何获取用户地理位置的授权,以及如何在用户拒绝授权后进行二次设置授权
因为需求是页面需要获取经纬度以及地理位置
所以第一次授权放onLoad

wx.getLocation({
      type: 'wgs84',
      success(res) {
        let latitude = res.latitude
        let longitude = res.longitude
        that.setData({
          latitude ,
          longitude 
        })
      }
    })

如果用户第一次授权通过了就获取了经纬度可以用于后续调用腾讯地图sdk
如果用户拒绝位置授权则进入第二步

2.用户没有授权位置信息时,可以通过事件触发方法让用户自主打开位置授权,如果用户一直没有位置授权则事件一直有效

 // 获取地理位置 wx.getSetting() 获取用户权限设置     wx.openSetting() 打开微信自带权限设置页面
  choiceAddress() {
    let that = this;
    wx.getSetting({
      success: (res) => {
        console.log(JSON.stringify(res))
        console.log(res.authSetting['scope.userLocation'])
        if (res.authSetting['scope.userLocation'] != undefined &&
         res.authSetting['scope.userLocation'] != true) {
          wx.showModal({
            title: '请求授权当前位置',
            content: '需要获取您的地理位置,请确认授权',
            success: function (res) {
              if (res.cancel) {
                wx.showToast({
                  title: '拒绝授权',
                  icon: 'none',
                  duration: 1000
                })
              } else if (res.confirm) {
                wx.openSetting({
                  success: function (res) {
                    if (res.authSetting["scope.userLocation"] == true) {
                      wx.showToast({
                        title: '授权成功',
                        icon: 'none',
                        duration: 1000
                      })
                    } else {
                      wx.showToast({
                        title: '授权失败',
                        icon: 'none',
                        duration: 1000
                      })
                    }
                  }
                })
              }
            }
          })
        } 
      }
    })
  },

以上代码可以直接使用
至此位置信息授权就完成了

2.关于接入腾讯地图sdk获取位置详细信息(地址逆解析)
首先配置腾讯sdk,下面是腾讯位置服务控制台的配置
(1).小程序要选择WebServiceAPI
(2).小程序 APPID必填(白名单可以不用,如果后台调用的可以配)
(3).免费版同时调用只支持10次(如后台接口查询地址逆解析一次最多10条数据) 一天最大调用10000次
在这里插入图片描述

前面已经拿到了经纬度,现在去逆解析获取地址
首先去app.js 设置一个全局变量

//腾讯位置服务的key
 qqMapKey: '****',

然后去下载qqmap-wx-jssdk.js文件放在utils文件夹下面(腾讯地图服务里面有)
小程序单页面引入并使用

const app = getApp();
const QQMapWX = require('../../utils/qqmap-wx-jssdk.js');
const qqmapsdk = new QQMapWX({
      key: app.globalData.qqMapKey
    });

    // 获取地址信息具体代码
              qqmapsdk.reverseGeocoder({
                location: {
                  latitude: data.latitude,
                  longitude: data.longitude,
                },
                success: function (res) {
                  console.log(res)
                  if (res.message == "query ok")
                    that.setData({
                      detailedAddress: res.result,
                    })
                },
                fail: function (res) {
                  console.log(res)
                }
              })
// detailedAddress就是逆解析出来的位置信息了

3.小程序唤起高德地图、腾讯地图做导航(简单)

 //点击定位唤起高德等app
  toLocation() {
    let that = this;
    wx.openLocation({
      latitude: Number(that.data.latitude),
      longitude: Number(that.data.longitude),
      name: that.data.shopName,
      address: that.data.detailedAddress.address,
    })
  },

方法参数如下
在这里插入图片描述

4.可以自己画地图等,包括一系列配置

希望能帮到大家,也便于自己记录(如果有帮助到大家可以点下赞哦~)!!!
如有疑问或者不对的地方可以下方评论留言讨论哦~会积极回复大家的!!!
在这里插入图片描述

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
80个微信小程序源码: 一个(仿) 一元夺宝主页设计 万年历 下拉刷新,tab切换 事项助手 云笔记 五十音图 五险一金计算 交互操作控件 人脸检测 今日头条 你画我猜 健康菜谱 全屏动画滚动 医药网 卡卡汽车 获取用户 设备信息 同乐居商城:购物车合算 商城 图书管理系统 图文信息;欢迎页面,音乐控制 图片自适应 ,富文本解析 圆形菜单 外卖:实现类似锚点功能 天气预报 妈妈课堂 小游戏-别踩白块 小熊的日记 小程序地图定位 小程序完整demo:飞翔的小鸟:canvas实现,java后端(适用1221) 小程序官方Demo 小程序版2048 小程序页面生成器 康爱多微商城:学习界面设计 录音机 微票 我厨 tab 界面设计 手势解锁 排队取号,map组件使用 掘金首页信息流 摇一摇换文章 教务系统 新浪读书 新闻客户端 易打卡 表单设计 星巴克中国 智能机器人 校内新闻大图 框架 水浒传 治疗师 涂鸦 瀑布流布局 用户反馈组件 相册;处理用户信息 省市选择控件 知乎 知乎日报 知乎日报1 科学计算器 移动小商城:基于node,包含前后台 移动端商城 网易云课堂 腾讯云小程序一站式解决方案 自定义tabbar 芒果TV 语音跟读 跑步 地理位置 计时器 身份证查询 轮播图+菜单 轮播图变换 重邮 面包旅行:界面设计,文本展示 题库:选择选项,切换至下一题 首字母排序选择 鲜花订购,animation动画卡片效果 麻将骰子:附详细教程
tesseract.js 是一个开源的光学字符识别(OCR)引擎,它能够将图片转换为可以理解的文本。而微信小程序是一种可以在微信平台上运行的小型应用程序。 通过结合 tesseract.js微信小程序,我们可以实现在小程序使用 OCR 功能。具体步骤如下: 1. 在微信小程序中导入 tesseract.js 的库文件,可以通过 npm 安装或在 CDN 上获取相关资源。 2. 在小程序中进行图像的采集,可以使用小程序提供的相关 API,如选择图片、拍照等。 3. 将获取的图片数据转换为 tesseract.js 能够处理的格式,通常为 Base64 或 Blob 类型。 4. 调用 tesseract.js 的 OCR 引擎,将图片数据传递给引擎进行文字识别。 5. 等待 OCR 引擎处理完成后,获取识别的文本结果。 6. 将识别的文本结果在微信小程序中展示给用户。 通过以上步骤,我们就能够在微信小程序中实现 OCR 功能。使用 tesseract.js 的优势在于其大的文字识别能力和开源的特性,同时微信小程序的用户量庞大,这样的结合可以为用户提供便捷而且功能大的文本识别体验。 当然,实现 OCR 功能还需要考虑到性能、用户体验和安全等因素。需要根据具体的需求和场景来开发和优化,以确保整体应用的质量和稳定性。 总之,通过 tesseract.js微信小程序的结合,我们可以在小程序中实现 OCR 功能,并为用户带来更好的用户体验。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值