uni-app/微信小程序接入腾讯位置服务地图选点插件

uni-app开发小程序-引用腾讯地图选点 官方入口文档入口:https://lbs.qq.com/miniProgram/plugin/pluginGuide/subway 以下概述: 1、插件申请接入: 在腾讯公众平台中, “微信小程序官方后台-设置-第三方服务-插件管理” 里点击 “添加插件”,搜索 “腾讯位置服务地铁图” 申请,审核通过后,小程序开发者可在小程序内使用该插件。 2、引入插件包,设置定位授权: 地图选点appId: wx76a9a06e5b4e693e 地图选点插件需要小程序提供定位授权才能够正常使... 阅读详情
AI摘要

本文介绍uni-app/微信小程序接入腾讯位置服务地图选点插件的方法。包括常见错误及解决办法,如插件未授权、类目不符等;详细说明了授权插件使用的操作,地图key的生成及配额管理,以及代码接入时在manifest.json和page.json中的配置。

0、常出现的错误及解决方法

0.1插件未授权使用(见步骤1)

0.2小程序类目不符合引用该类目插件的要求或主体类型不符合要求(见步骤1)

0.3该接口日访问量已用完(见步骤2)

0.4需要在app.json中声明permission scope.userLocation 字段(见步骤3)

1、授权插件使用

腾讯位置服务的文档对该插件的接入指引中提到:

在腾讯微信公众平台中, “微信小程序官方后台-设置-第三方服务-插件管理” 里点击 “添加插件”,搜索 “腾讯位置服务地图选点” 申请,申请后小程序开发者可在小程序内使用该插件。

但实际操作过程中,在添加插件的搜索页中,直接搜索腾讯位置服务地图选点,并不能找到的对应的插件。

通过文档查看可以知道,该插件适用的类目为交通服务 > 导航地图。

这时就算在腾讯位置服务的网页中添加该插件,会提示

添加失败,小程序类目不符合引用该类目插件的要求或主体类型不符合要求

在小程序后台首页点击添加类目时又发现,交通服务下没有导航地图的类目。

这时可以访问微信服务市场,搜索腾讯位置服务地图选点插件,选择接口与插件,就能找到对应的插件,或直接点击这里,登录相同的账号点击添加即可完成授权
在这里插入图片描述
添加插件完成后,在微信小程序官方后台-设置-第三方服务-插件管理中即可看到对应的插件
在这里插入图片描述
点击详情,可以查看该插件的相关信息及接入文档

2、地图key生成

腾讯位置服务地图选点插件接入文档中提到需要一个地图key,首先登录腾讯位置服务控制台,点击左侧应用管理,创建应用,再添加key。
在这里插入图片描述

在这里插入图片描述
创建完key之后,要记得对key 做配额管理,不然在应用中,会提示该接口日访问量已用完
特别是周边推荐的接口额度
在这里插入图片描述

3、代码接入

在manifest.json中,微信小程序配置中填写appid 勾选位置接口(若不勾选 最后会提示需要在app.json中声明permission scope.userLocation 字段)
在这里插入图片描述
在page.json中插入组件

"plugins": {
	"chooseLocation": {
		"version": "1.1.1",
	    "provider": "wx76a9a06e5b4e693e"
	}
}

template

<template>
	<view>
		<button @click="open">打开地图选点</button>
		<view v-if="info">
			<text>地址:{{info.address}}</text>
			<text>坐标:{{info.latitude}}, {{info.longitude}}</text>
		</view>
	</view>
</template>

js

const chooseLocation = requirePlugin('chooseLocation');
export default {
	data() {
		return {
			info: null
		}
	},
	onShow() {
		// 如果点击确认选点按钮,则返回选点结果对象,否则返回null
		const location = chooseLocation.getLocation(); 
		this.info = location
	},
	open() {
		const key = '11111'; //使用在腾讯位置服务申请的key
		const referer = '1'; //调用插件的app的名称
		const location = JSON.stringify({
			latitude: 39.89631551,
			longitude: 116.323459711,
		});
		const category = '生活服务,娱乐休闲';
		//其他需要的参数,可以查看文档
		uni.navigateTo({
			url: `plugin://chooseLocation/index?key=${key}&referer=${referer}&location=${location}&category=${category}`,
		});
		
	}
}
在微信小程序中打开地图选择位置功能 说真的,这是我第一次接触移动端的地图模块,一开始我真的一头雾水,感觉这个很难,但是通过不断的探索,在慢慢摸索中,一点一点搞懂了很多东西,还是很开心的,就想把我的经验分享给大家。希望能帮助到你们~ 阅读详情

相关推荐

2023超级详细微信小程序纯前台获取当前具体位置,地图上选点进行位置签到 计算签到距离

调用微信小程序中获取当前地理位置的方法,与设置地理位置的方法,通过、、、实现当前距离设置打卡地点的距离,如果自定义的距离小于等于设置的距离,且签到时间在有效的范围中,则签到成功,并且签到只能是一次。-> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置request合法域名,添加https://apis.map.qq.com(可以不设置,但会有一个安全提示)会议OA的签到功能,商场项目的收货地址的取代三级联动,以及许多使用位置的功能都可以用得上。console.log("调用地理位置")

m0_73647713的博客 4160

腾讯地图系列(三):微信小程序引用插件的问题解决

微信小程序引用插件的问题解决

qq_45796592的博客 6847

uni-app 微信小程序 腾讯地图选点插件

微信小程序插件 | 腾讯位置服务https://lbs.qq.com/miniProgram/plugin/pluginGuide/locationPicker 引入插件包和定位授权: "plugins": { "chooseLocation": { "version": "1.0.9", "provider": "wx76a9a06e5b4e693e" } }, "permission": { "scope.userL

这里是痞子Monkey的博客 1166

uni-app中实现位置授权以及打开地图选择位置功能

注意点:this的指向问题,是否指向vc决定你能否拿到data里面的数据。

JunVei的博客 1418

uni-app微信小程序集成腾讯地图选点与城市选择器实战指南

地图与位置服务是现代移动应用的核心功能模块,其原理是通过GPS、基站或Wi-Fi信号获取设备的地理坐标,并结合地理信息系统(GIS)进行可视化与交互。在跨端开发框架中,如何高效、稳定地集成原生地图能力,是提升应用体验与工程效率的关键技术挑战。本文聚焦于**uni-app**微信小程序生态,深入解析如何利用**腾讯位置服务官方插件**,系统化地实现地图选点与城市选择两大高频功能。内容涵盖从插件选型、权限配置、坐标系处理,到搜索联想、逆地址解析、性能优化及多端兼容等全链路工程实践,为开发者提供一套可复用的解决方

weixin_30482181的博客 418

微信小程序 - 最新打开地图选择位置功能,支持定位附近位置、搜索全国位置及地图标点位置、检索周边位置,可移动选点标记位置(点击选择位置后,获取位置精确详细地址及名称,拿到经纬度等信息)

微信小程序,vue2,vue3,腾讯地图,地图搜索,搜索位置,搜索城市,地图上标记当前定位,打开地图选择位置,内置地图选地区,获取当前经纬度以及打开地图选择位置信息,小程序怎么实现地图定位,怎么打开内置地图让用户自己选择位置,在地图上搜索位置选择,拿到详细地址省市区街道,地图选点获取用户选择的定位信息,打开腾讯地图让用户选择位置功能,小程序中打开地图选择当前定位位置功能,地图选点获取地址,如何实现点击后地图选择定位位置,打开地图选择位置完整功能代码(定位检索周边可移动选点可搜索腾讯地图API),微信小程序授

🏆 前端领域优质创作者 3798

uni-app中使用腾讯位置服务实现小程序地图选点功能

技术选定(地图选点插件) (对应官网:https://lbs.qq.com/miniProgram/plugin/pluginGuide/locationPicker ) 1. 如果是微信小程序则直接按照,文档给定的4项步骤配置完成; ** 如果使用uni-app开发的小程序,配置的位置 HBuilder工具中注意 ** 如图: 2. 实现代码【上面链接官方都有】 manifest.json /* 小程序特有相关 */ "mp-weixin": { "appid": "wx6a968da933

眼中世界在己 4172

nature子刊:MCNN基于电池故障诊断的模型约束的深度学习方法

本研究提出了一种基于模型约束神经网络(MCNN)的锂离子电池在线故障诊断方法,整合物理模型与深度学习,有效解决了随机工况下传统方法诊断精度低、依赖故障样本等问题。通过统计修正电池包模型和双向LSTM网络,实现了电池状态的高精度预测(平均RMSE 3.9%),并设计模型耦合自动编码器提取可解释特征。在包含18.2百万条真实车辆数据的验证中,该方法故障检测TPR在FPR=0.1时达85%,较基准方法提升超46.5%,且能提前30分钟预警内部短路等故障。研究还展示了算法在跨电池包结构迁移中的优越性,为工业应用提供

hasakie的博客 1757

uni-app开发微信小程序使用腾讯地图选点和城市选择器插件

因为开发微信小程序,所以我这里用的是腾讯地图选点插件。附上官方文档腾讯地图选择器插件腾讯地图选点插件。

铁锤妹妹的博客 1万+

【从零开始玩量化1】AKShare: Python开源财经数据接口库

文章目录量化的第一步:数据AKShare介绍AKShare安装AKShare使用AKTools安装/使用结语 量化的第一步:数据 想要玩量化,第一步要有数据,这个数据可能是历史交易数据、财务数据、宏观数据等等。我们最终要做的,无非就是从数据中分析出有价值的信息,以便用来指导投资策略。 在获取数据的这条道路上,我走了很多弯路,尝试了各种方法:使用Tushare到放弃、自己写网易股票页面的爬虫,自己写申万行业数据的爬虫、自己写同花顺问财的爬虫、使用聚宽的免费数据API等等,直到最终,我发现了AKShare。 A

量化投资助手的博客 5万+

ESP-IDF下载配合MQTT协议接入云平台实例

通过ESP-IDF下载环境搭建,结合MQTT协议实现设备与云平台通信,详解从配置到连接的完整流程,助力物联网应用开发。重点涵盖espidf下载和MQTT集成关键步骤。

weixin_28913879的博客 454

uniapp微信小程序使用地图选点插件

uniapp微信小程序使用地图选点插件

Smile_ping的博客 2894

几率大的网络安全面试题(含答案)

其他篇章:Java校招极大几率出的面试题(含答案)----汇总 本文面试题汇总: 防范常见的 Web 攻击 重要协议分布层 arp协议的工作原理 rip协议是什么?rip的工作原理 什么是RARP?工作原理 OSPF协议?OSPF的工作原理 TCP与UDP区别总结 什么是三次握手四次挥手? tcp为什么要三次握手? dns是什么?dns的工作原理 一次完整的HTTP请求过程 Cookies和ses...

睶 6万+

uni-app腾讯地图位置选点

1.进入小程序 2.选择开发工具-------腾讯位置服务(开通)------进行登录授权------绑定开发者账号 3.找到设置------第三方设置-------点击添加插件(搜索自己搜药的) 4.开发者密钥配置 1.腾讯位置服务 - 立足生态,连接未来 2.点击添加key 微信小程序的授权APPID:在设置-------基本设置---------账号信息 5.微信小程序插件 | 腾讯位置服务 这两块内容添加在源码...

m0_60662967的博客 1302

现控报告-- 分析倒立摆系统稳定性、能控性及能观性分析,设计PID控制方案(附matlab)

建立直线一级倒立摆系统的动力学模型,推导该系统的运动方程,求出直线一级倒立摆系统传递函数模型及空间状态方程模型。接着描述了PID控制系统设计原理及PID控制器各校正环节的作用,简要叙述了参数的整定方法。设计了直线一级倒立摆摆杆摆角及小车位置常规单回路控制器,通过Simulink仿真知道常规单回路控制器能控制摆杆摆角,不能控制小车位置。于是设计出了直线一级倒立摆双闭环控制器及基于倒立摆系统的状态空间方程控制器,利用软件进行仿真,仿真结果表明,常规双闭环控制方案和基于状态空间方程加控制方案均能对摆杆摆角及小车位

mengshenglo的博客 4万+

【隐私计算】从本地加法到在线乘法:Beaver Triple如何重塑算术秘密分享的运算效率

本文深入探讨了Beaver Triple在算术秘密分享中的关键作用,显著提升了隐私计算中的乘法运算效率。通过对比加法与乘法的实现差异,详细解析了Beaver Triple的预处理机制和在线计算优化,展示了其在减少通信量和计算时间方面的革命性突破。

weixin_29227585的博客 434

uni-app 小程序使用什么地图好(百度,高德,腾讯)

在开发小程序的时候我们会发现经常需要地图的使用,但是市面上主流的地图有腾讯,高德,百度。哪个好了其实在我看来这个3地图没有好坏之分,各有所长。只是说哪个地图写小程序更加轻便,更加低耦合。后面我把他们都试了一下发现,他们的使用方式都差不多,都是申请一个类似标识的东西,调用各自东西。uni-app官网好像说暂时不支持百度地图,腾讯和高德都是以原生sdk的方式引用。类似第三方js文件动态引入。

路虽远行则将至,事虽难做则必成。 3698

微信小店推客分销系统源码获取与自研开发全攻略(2025年最新版)

源码选择建议快速试错:选用开源项目(如启航系统),3天可上线基础功能长期布局:购买商业源码授权,重点定制分佣规则与UI交互完全自研:适合年GMV过亿的大型企业,需前置投入风控与合规设计行动清单注册微信开放平台账号,完成视频号机构认证下载开源项目代码,部署本地测试环境联系三家源码供应商,获取合规性审计报告设计三级分佣比例表,通过法律顾问合规审查通过以上路径,可高效构建合规、稳定、高转化的微信小店推客分销系统,抢占2025年视频号电商红利。

2401_85184777的博客 1280

微信小程序 - - 地图及导航

地图及导航一、开发前的准备二、代码实现1.index.vue2.mappage.vue3.pages.json4.app.json 一、开发前的准备 1.环境准备:HBuilderX(软件管理中可以下载),微信开发者工具, 2.在微信公众平台(官方)上注册申请一个微信小程序 3.获取小程序的AppID 4.在腾讯位置服务上创建一个应用 5.配置key 6.代开HbuilderX创建一个项目 7.将项目运行到小程序模拟器(HBuilder连接微信开发者工具) 注意:需要提前将微信开发者工具的服务

是草莓味的啊 6438

llama.cpp 参数调优大全(4060 最优配置)

本文针对NVIDIA RTX 4060(8GB显存)显卡,提供了llama.cpp参数调优的实战指南。核心策略是采用小模型(7B/8B)配合Q4_K_M量化,通过合理设置GPU层数(-ngl 28)、上下文长度(-c 2048)和批量大小(-b 512)来平衡性能和显存占用。重点推荐启用flash-attn加速和mlock内存锁定,并给出标准、高性能和保守三种配置方案。调优优先级为:GPU利用率>吞吐量>显存>线程数,同时警示避免常见错误如过大上下文或GPU层数设置。最终推荐4060最佳配置为7B Q4_

刘一说的IT专栏 3402

廖雪峰Python教程[完整版]

廖雪峰的python教程整理的,已经排好版了,而且还是完整的,适合小白

(uni-app)微信小程序之腾讯地图(定位当前位置,地图标点及导航)

微信小程序之腾讯地图二(导航) 话不多说,直接上图!!! 一、dom <template> <view> <map id="tencentMap" :style="[...mapStyle]" :show-compass="showCompass" :enable-traffic="enableTraffic" :longitude="longitude" :latitude="latitude" :marker

阳光总在风雨后丶 9123

SIMATIC S7-1200, S7-1500 PID 控制[手册]

SIMATIC S7-1200, S7-1500 PID 控制[手册]

uni-app 小程序使用腾讯地图完成搜索功能

使用uni-app开发小程序时候使用腾讯地图原生SDK是,要把原生写法转成vue写法在这记录一下。我们需要注意的是使用高德地图时我们不仅要引入SDK,还要再uni-app中配置允许使用。由于uni-app内置地图就是腾讯,所以获取位置的api,uni.getLocation坐标不用转换,直接使用。高德地图原生sdk搜索,我用地点搜索,渲染结果。达到联想值效果,点击跳转。

路虽远行则将至,事虽难做则必成。 5923

jre9下载 jdk9

(Java SE Runtime Environment 9.0) 9.0u175 官方最新版 【x86|x64】

怀旧版电脑GBC模拟器

再现原版GBC掌机的界面,电脑运行连游戏界面都一样大小,很怀旧,很真实,(英文版)强烈推荐,很小的文件,很难才找到的。

uniapp+vue 微信小程序如何引入腾讯地图插件

开发原因:网上大多数教程是在原生微信小程序基础上开发,我搜了挺多资料,很少有uniapp+vue结合的内容 ,有的话也是付费内容。以上内容 希望能够帮助大家解决小程序引入腾讯地图插件的问题,也希望可以和大家一起来学习小程序开发的相关知识,如果能帮到您,我深感荣幸~~这里的话,我这边出现的情况是,只能搜索到腾讯位置服务城市选择器这个插件。报错后-->去开通该接口权限,需要重新打开HBuilder X 并运行微信开发者工具才可以。读者可以去查询最新的版本号,--->>>>发现是额度不足,就是额度没进行分配,

qq_45683287的博客 3031

uni-app 云开发地图服务端聚合插件 uni-map-common 实战指南

uni-app 开源的 [uni-map-common](https://link.gitcode.com/i/c2c6f083822b60904828315c15bff9be) 是一个部署在 uniCloud 云函数中的地图服务端公共模块,它聚合了高德地图与腾讯地图两家的服务端 WebService API,开发者只需几行代码即可完成逆地址解析、坐标转换、周边搜索、路线规划等能力接入,并得到字段

gitblog_00782的博客 412

uni-app微信小程序结合腾讯地图获取定位导航以及城市选择器

uni-app微信小程序结合腾讯地图获取定位导航以及城市选择器

weixin_46324536的博客 8148
上一篇: node-sass sass-loader与node版本
下一篇: uniapp h5接入地图选点组件
菜冬眠。
博客等级 码龄10年 31粉丝 65原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

菜冬眠。

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值