微信小程序(五十七)打开腾讯地图选择位置

news/2024/7/20 2:36:56 标签: 微信小程序, 小程序

注释很详细,直接上代码

前提配置看第五十四篇🐧

上一篇

新增内容:
1.使用地图选择位置的方法让用户重新选择大概的位置
2.留下经纬度接口以便于更新新的附近位置列表

源码:

index.wxml

<button bind:tap="chooseLocationByMap" type="primary">打开地图获取位置</button>

index.js

// 引入js文件,'../'是往上一级目录,文件地址别搞错了
import QQMapWX from '../../libs/qqmap-wx-jssdk'

//创建实例
const qqmapsdk=new QQMapWX({//填上自己之前创建并分配了额度的key
  key:'QWQBZ-XR5CZ-Z2IXO-Z2FDP-ADRS3-QCBBX'//随时失效自个申请一个吧
})

Page({
  async chooseLocationByMap(){
    //打开地图获取位置
    const res=await wx.chooseLocation()
    console.log(res)

    //解构经纬度便于其他接口使用
    const {latitude,longitude}=res

    console.log(latitude,longitude)

  }
})

app.json(记得删注释)

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "Weixin",
    "navigationBarBackgroundColor": "#ffffff"
  },
  "style": "v2",
  "componentFramework": "glass-easel",
  "sitemapLocation": "sitemap.json",
  "lazyCodeLoading": "requiredComponents",

  "requiredPrivateInfos": [
    "chooseLocation"//这里是需要声明使用的(记得删注释)
  ],
  "permission": {
    "scope.userLocation": {
      "desc": "您的位置信息将用于为您提供准确的服务"
    }
  }
}

效果演示:

在这里插入图片描述

在这里插入图片描述


http://www.niftyadmin.cn/n/5424622.html

相关文章

Python 配置信息的添加和获取

1.效果如下&#xff1a; 2.代码如下&#xff1a; from configparser import ConfigParser import threadingclass Config():_instance_lock threading.Lock()classmethoddef instance(cls, *args, **kwargs):if not hasattr(Config, "_instance"):with Config._ins…

基于SWOT的智能手机企业财务战略研究1.62

摘 要 近些年&#xff0c;网络技术日新月异&#xff0c;智能手机深受消费者喜爱&#xff0c;人们通过网络&#xff0c;手机应用&#xff0c;可以极大地方便人们学习&#xff0c;工作等等。由于国家对电信行业的大力支持&#xff0c;中国消费者群体逐步成为最具潜力的手机购买者…

【NR技术】 3GPP支持无人机服务的关键性能指标

1 性能指标概述 5G系统传输的数据包括安装在无人机上的硬件设备(如摄像头)收集的数据&#xff0c;例如图片、视频和文件。也可以传输一些软件计算或统计数据&#xff0c;例如无人机管理数据。5G系统传输的业务控制数据可基于应用触发&#xff0c;如无人机上设备的开关、旋转、升…

MATLAB算法实战应用案例精讲-【图像处理】边缘检测算子

目录 前言 数字图像处理基础知识与算法 1).数字图像 2).二值图像、灰度图像、彩色图像

Java Web实战(四)Web后端之MySQL语法使用详解-2

目录 1. 多表设计1.1 一对多1.1.1 外键约束 1.2 多对多1.3 设计案例关系分析 2. 多表查询2.1 连接2.2 子查询2.2.1 分类2.2.2 案例 3. 附录MySQL 索引数据结构--B树 1. 多表设计 一对多 多对多 1.1 一对多 例如 部门信息表(tb_dept) 和 员工信息表(tb_emp), 部门信息表存放着…

ASR语音识别纠错-fast correct

1、使用方式说明 ASR对应的文本越长&#xff0c;识别准确率和召回率越高 识别的错误分类&#xff1a; 编号错误类型示例1谐音字词配副眼睛-配副眼镜2混淆音字词流浪织女-牛郎织女3多字错误关关机-关机4少字错误 爱有天意-假如爱有天意 5形似字错误高梁-高粱6中文拼音全拼xin…

vue使用elementPlus ui框架,如何给Dialog 对话框添加Loading 自定义类名显示隐藏

vue使用elementPlus ui框架时&#xff0c;如何给Dialog 对话框添加Loading 自定义类名&#xff0c;想要实现dialog对话框区域有loading效果 官方给出的这个API配置项customClass&#xff0c;使用不太明确。暂时无法实现绑定class。 最后的实现方式&#xff1a; <template&…

LaneNet 论文阅读

论文链接 Towards End-to-End Lane Detection: an Instance Segmentation Approach 0. Abstract 在本文中&#xff0c;将车道检测问题转化为实例分割问题——其中每个车道形成自己的实例——可以进行端到端训练为了在拟合车道之前对分段车道实例进行参数化&#xff0c;应用基…