微信小程序接入百度地图(微信小程序插件)使用文档

第一步配置域名

  1. :在微信公众平台登录后配置服务域名称:https://apis.map.qq.com

配置百度地图服务地址

第二步申请密钥

  1. 申请开发者密钥申请地址
    在这里插入图片描述
    我是根据当前id地址进行设置
    在这里插入图片描述

第三步使用插件

  1. 选择添加插件
    服务市场添加插件

  2. 搜索腾讯位置服务地图选点
    在这里插入图片描述

  3. 选择要授权的小程序
    在这里插入图片描述

  4. 授权完毕会在这里显示插件信息
    在这里插入图片描述

第四步查看使用文档

  1. 跳转至文档查看
    点击详情

  2. 跳转后点击开发文档
    在这里插入图片描述

  3. app.json中进行相关的配置

//引入插件包"plugins": {"chooseLocation": {"version": "1.0.10","provider": "wx76a9a06e5b4e693e"  //这里使用默认未修改}},
//设置定位授权"permission": {"scope.userLocation": {"desc": "你的位置信息将用于小程序定位"}},
  1. 页面调用
    const key = ''//输入当前的keywx.getLocation({type: 'gcj02', //wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标success: res => {console.log(res);const {latitude,longitude} = resconst key = key; //使用在腾讯位置服务申请的keyconst referer = 'numberApp'; //调用插件的app的名称const location = JSON.stringify({latitude: latitude,longitude: longitude});const category = '生活服务,娱乐休闲';wx.navigateTo({url: `plugin://chooseLocation/index?key=${key}&referer=${referer}&location=${location}&category=${category}`})},fail: error => {console.log(error);}})

第五步页面展示

  1. 点击上面方法跳转后会到地图页面
    在这里插入图片描述

2.点击搜索后会有模糊查询
在这里插入图片描述
在这里插入图片描述

  1. 地址选择完成后点击确认地点,会在当前页面的onShow中返回地点信息
const chooseLocation = requirePlugin('chooseLocation')
const location = chooseLocation.getLocation(); // 如果点击确认选点按钮,则返回选点结果对象,否则返回null
console.log(location);
if(that.data.locaStatus && location !== null) {if(that.data.locaStatus == 1) {that.setData({'userInfo.pcsqCfd': location.name})} else {let district = location.districtthat.setData({'userInfo.pcsqMdd': location.name})//我做的是输入用车起始地和目的地后判断用车范围const data = districtData.some(item=>item == district)if(!data) {setTimeout(()=>{wx.showToast({title: "用车超出范围,请重新选择",icon: 'none',duration: 2000});that.setData({'userInfo.pcsqMdd':""})},1000)}}}

在这里插入图片描述

在这里插入图片描述

附加配额使用

  1. 账户额度:对不同的接口进行额度分配
    在这里插入图片描述

  2. Key额度:可以查看今天的接口使用情况
    在这里插入图片描述

  3. 调用统计:统计今日的情况用曲线图展示
    在这里插入图片描述

说明:以上设置可在微信小程序中使用百度地图插件,自定义地图使用不包含

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/723268.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【SQL】指定日期的产品价格(IFNULL函数)

题目描述 leetcode题目:指定日期的产品价格 思路 找出所有的产品的指定的日期的价格;若找不到某个产品的更改日期,则将该产品价格设置为10。 关键点: if没有16号的,怎么找到前一个日期的?> 日期小…

Word中的文档网格线与行距问题

在使用Word编辑文档时,经常会发生以下动图展示的这种情况: 上面的动图里,将文字大小放大到某个字号时,单倍行距的间距突然增加很多。造成这种情况的原因是文档中定义了网格线,并且设置了对齐到网格线。如果取消文档中…

EdgeX Foundry 基本操作

文章目录 一、容器管理1.容器操作2.查看容器日志 二、EdgeX UI 操作1.访问 UI1.1. consul1.2. EdgeX Console 2.创建 MQTT 设备2.1.创建设备配置文件2.2.添加设备 3.设备配置文件3.1.配置文件管理3.2.修改配置文件 4.设备4.1.设备管理4.2.修改设备信息4.3.命令4.4.自动采集 5.设…

mac版本的vscode如何运行html文件

1.安装Live Server扩展 需在VS中安装一个拓展插件Live Server,插件寻找方法如下: 2.编写HTML文件 3.启动Live Server 在VSCode中打开你的HTML文件,并点击右键选择"Open with Live Server",或者点击右下角的"Go…

【MATLAB】 CEEMD信号分解+FFT傅里叶频谱变换组合算法

有意向获取代码,请转文末观看代码获取方式~ 展示出图效果 1 CEEMD信号分解算法 CEEMD 分解又叫互补集合经验模态分解,英文全称为 Complementary Ensemble Empirical Mode Decomposition。 CEEMD是对EEMD的改进,它在EEMD的基础上引入了一个…

46、Numpy手推共空间模式CSP,用于脑电EEG信号分类

一、Numpy实现CSP公式及对应的代码 CSP全部流程: 1、CSP先将数据按照类别分类,两类数据可分为E1、E2 2、计算分类后的原始数据的协方差矩阵: 方差矩阵: C协方差矩阵,E原始EEG信号,trace求迹 实现代码&a…

政安晨【TypeScript高级用法】(四):模块与声明文件

TypeScript是一种静态类型的JavaScript超集语言,它支持模块化开发和声明文件。 模块化开发是一种将代码分割为独立的模块,每个模块只关注自己的功能,然后通过导入和导出来实现模块之间的交互和复用。在TypeScript中,可以使用impo…

短视频矩阵系统--抖去推---年后技术还能迭代更新开发运营吗?

短视频矩阵系统#短视频矩阵系统已经开发3年,年后这个市场还能继续搞吗?目前市面上开发短视频账号矩阵系统的源头公司已经不多了吧,或者说都已经被市场被官方平台的政策影响的不做了吧,做了3年多的矩阵系统开发到现在真的是心里没有…

Android 14后台服务永久保活的技术方法

Android 14后台服务永久保活的技术方法 在本篇博客中,我们将探讨如何创建一个在Android系统中不会被杀死的后台服务。 第一步:创建一个后台服务。 在这一步中,我们需要创建一个后台服务的代码。 第二步:在AndroidManifest.xml中…

【从Python基础到深度学习】10. Python深层拷贝 和 浅层拷贝

对于浅层拷贝而言 不会发生拷贝的数据类型有:number、str、tuple 会发生拷贝的数据类型有:list、dict、set 对于不可变的数据类型,浅层拷贝时,不会发生拷贝,只是引用关系 对于可变数据类型&#…

CSS极速入门

CSS介绍 什么是CSS? CSS(Cascading Style Sheet),层叠样式表,用于控制页面的样式. CSS能够对网页中元素位置的排版进行像素级的精确控制,实现美化页面的效果.能够做到页面的样式和结构分离. CSS可以理解为"东方四大邪术"的化妆术. 对页面展示进行化妆. 基本语法规…

[BUG]vscode插件live server无法自动打开浏览器

问题描述: 点了open with live server但是浏览器没有自动跳出来 http://127.0.0.1:5500/里面是有东西的 解决方法: 配置环境变量,在path中添加program files

SAR ADC学习笔记(3)

一、SAR ADC采样电路 1.采样网络的时域响应:采保信号 2.采样网络的KT/C噪声 3.采样抖动 采样开关的种类 1.单MOS管开关 2.传输门开关 3.栅极自举(Bootstrap)开关 结论:M4的衬底需要和B点短接,保证B点能够到达高压&…

Doris——纵腾集团流批一体数仓架构

目录 前言 一、早期架构 二、架构选型 三、新数据架构 3.1 数据中台 3.2 数仓建模 3.3 数据导入 四、实践经验 4.1 准备阶段 4.2 验证阶段 4.3 压测阶段 4.4 上线阶段 4.5 宣导阶段 4.6 运行阶段 4.6.1 Tablet规范问题 4.6.2 集群读写优化 五、总结收益 六…

【Vue】VueX仓库

📝个人主页:五敷有你 🔥系列专栏:Vue ⛺️稳中求进,晒太阳 目录 Vue概述 是什么 场景: 优势 构建多组件共享环境 创建一个空仓库 核心概念 - state 状态 1. 提供数据 2.使用数据 ​编辑 …

结合大象机器人六轴协作机械臂myCobot 280 ,解决特定的自动化任务和挑战!(上)

项目简介 本项目致力于探索和实现一种高度集成的机器人系统,旨在通过结合现代机器人操作系统(ROS)和先进的硬件组件,解决特定的自动化任务和挑战。一部分是基于Jetson Orin主板的LIMO PPRO SLAM雷达小车,它具备自主导航…

ELF 1技术贴|在NXP源码基础上适配开发板的按键功能

本次源代码适配是在NXP i.MX6ULL EVK评估板的Linux内核源代码(特定版本号为Linux-imx_4.1.15)的基础中展开的。 首要任务集中在对功能接口引脚配置的精细调整,确保其能无缝匹配至ELF 1开发板。接下来,我们将详细阐述适配过程中关…

MapReduce内存参数自动推断

MapReduce内存参数自动推断。在Hadoop 2.0中,为MapReduce作业设置内存参数非常繁琐,涉及到两个参数:mapreduce.{map,reduce}.memory.mb和mapreduce.{map,reduce}.java.opts,一旦设置不合理,则会使得内存资源浪费严重&a…

KingbaseES-V8R3下载安装及基础配置以及创建用户数据库

KingbaseES-V8-R3安装 1 下载准备安装包 下载地址:https://gitlab.cn/renfei/KingbaseES-V8-R3 准备好安装包及license.dat文件上传至服务器 2 挂载安装包 安装包为iso文件,需要挂载到目录 mount KingbaseES_V008R003C002B0340_Lin64_install.iso /…

Day 6.有名信号量(信号灯)、网络的相关概念和发端

有名信号量 1.创建: semget int semget(key_t key, int nsems, int semflg); 功能:创建一组信号量 参数:key:IPC对像的名字 nsems:信号量的数量 semflg:IPC_CREAT 返回值:成功返回信号量ID…