使用uni-app开发微信小程序调用腾讯地图获取周边

最新推荐文章于 2025-03-20 15:12:23 发布

```???

最新推荐文章于 2025-03-20 15:12:23 发布

阅读量1.9k

点赞数 2

分类专栏： UNI-APP 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/zd_88888/article/details/107402657

版权

使用uni-app调用腾讯地图获取周边

首先打开腾讯地图api下载sdk，然后解压

import QQMapWX from "@/static/qqmap-wx-jssdk.min.js"//引入sdk
uni.getLocation({
   //获取经纬度
	type: 'gcj02',
	success: function(res)

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

```???

关注关注

2
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

「uniapp」 H5高德地图定位、周边、路线规划、多点绘制、位置点击监听

拥抱AI Design

06-22

2998

>本文主要实现uniapp H5高德地图定位、周边、路线规划、多点绘制。解决新版本高德地图WEB端（JSAPI）`INVALID_USER_SCODE`平台报错问题及自自定义图标大小调整。

uni-app（微信小程序）获取当前位置uni.getLocation

cyj0919的博客

07-14

4382

1、微信公众平台开发开发管理。3、下载腾讯地图插件并引入到文件中。2、开通之后到项目文件。

参与评论您还未登录，请先登录后发表或查看评论

通过腾讯地图、高德地图、百度地图开发接口获取坐标对应的周边相关信息

YunWisdom

09-06

3834

通过腾讯地图、高德地图、百度地图开发接口获取坐标对应的周边相关信息更新：以前出于好意暴露了个人的KEY，现已被烂用。为不影响您的业务，请使用我的KEY的朋友去申请自己的KEY，我的KEY将在不久后停用。在通过 geolocation 获取到当前的 GPS 坐标后，需要通过“逆地理位置解析”才能得到街道对应的街道、建筑物、周边等相关信息。下面我使用国内的三家主要的地图厂商（腾讯地图...

uniapp小程序使用高德地图

最新发布

weixin_44708030的博客

03-20

474

/ 下载高德地图的amap-wx.130.js 文件// 高德地图申请好的Web端开发者 Key// 创建地图export {useAMapWX,mapKey。

“技术让生活更便捷”之腾讯位置服务JavaScript API2.0前端定位和位置标注的开发实录

漏刻有时数据可视化大屏（PHP&ECHARTS智能化开源软件系统）

01-30

2285

文章目录前言一、项目需求1.项目需求2.需求分解二、开发实战1.引入功能库和附件库2.构建腾讯地图容器3.调用前端定位组件1.定位成功回调函数获取位置坐标显示地图定义当前位置maker样式图片读取信息点(POINTS)并在地图上标注经纬度标注封装函数计算两点间的距离函数封装2.定位失败回调函数三、坐标经纬度拾取1.腾讯坐标拾取器2.WebService API地址解析（地址转坐标）四、注意事项1.script标签加载API服务2.附加库的引入3.自动定位组件库4.经纬度位置5.腾讯、百度和高德地图开发比较开

uni-app定位获取自身和附近定位信息

bilibid的博客

10-16

4283

可能因为浏览器原因，定位会在浏览器中会失效，可以通过真机调试的方式进行定位和数据的调试。 1、调用api获取自身定位经纬度 2、通过经纬度获取地址信息引入腾讯sdk.js下载地址. 其中key值是申请的腾讯开发者地图的key值，如何申请key值可以查看官网定位成功res返回的数据中，有自身定位的地址信息，还包括市区镇。 3、获取附近若干地址信息列表根据腾讯地图开发者平台的api，通过传入经纬度，获取经纬度附近地址信息列表 ...

uni-app 支持多端第三方地图定位的方法

11-30

简介该方法支持跳转第三方地图并定位指定坐标。 APP端跳转至百度地图（第三方软件）；若无，则跳转至高德地图（第三方软件）；若均无，则打开腾讯地图（uni自带方法：uni.openLocation）其它端打开腾讯地图（uni自带方法：uni.openLocation） demo 源码：https://github.com/yapeee/uni-components 测试数据： wgs84: 39.9078008469, 116.391290596 bd09: 39.915547, 116.403909 gcj02: 39.9091591069, 116.3974783161 基础

uni-app开发微信小程序.zip

07-02

【uni-app开发微信小程序】结合了两者的优势，使得开发者可以通过uni-app来开发微信小程序。这主要体现在以下几个方面： 1. **组件化开发**：uni-app支持Vue.js的组件化开发模式，使得代码结构清晰，易于维护。...

微信小程序+腾讯地图开发实现路径规划绘制

10-16

微信小程序与腾讯地图的结合使用是一个相当热门的领域，尤其在实现路径规划和导航功能方面。微信小程序为腾讯地图提供了一个便捷的接入平台，通过腾讯地图提供的API，开发者可以实现路径规划绘制等功能。首先，...

uniapp在微信小程序引用腾讯地图实现自定义省市区海量点

weixin_52830464的博客

06-05

547

uniapp在微信小程序引用腾讯地图实现自定义省、市、区、项目、设备海量点，根据地图的zoom设置成4-6级是省级别、7-9级是市级别、10-12级是区级别、13和14级是项目级别、15级-15级以上是设备级别。/utils/qqmap-wx-jssdk.js 该文件是腾讯地图的sdk 根据传递的经纬度获取详细地址。登录腾讯地图开发平台创建key。

微信小程序map组件查找周围各种场所(通过腾讯位置服务)

weixin_45389051的博客

06-29

7203

废话不多说，直接写咋实现主要用到了腾讯位置服务里面的微信小程序JavaScript SDK,你得先申请一个开发者密钥，这里就不多说了实现效果如下,这里面是搜索周围的餐厅首先wxml代码 <map id="map" bindcontroltap="bindControlTap" bindregionchange="bindRegionChange" longitude="{{longitude}}" latitude="{{latitude}}" markers="{{markers}}" co

微信小程序使用map结合腾讯地图api解决搜索补全以及获取附近

Ych_cxy的博客

09-30

1292

全部复制粘贴就OK,备注写的你肯定能看懂 html <view class='view-c'> <view class='view-top'> <text style="font-size: 24rpx;margin-top: 40rpx; color: #b65151">当前：{{district}}</text> <input place...

如何在微信小程序中使用高德地图api查询附近周边信息并标志多处位置（uniapp）

NSX-Truth

06-23

8849

1. 前言这是本人毕业设计中其中一个功能点，就是用户在微信小程序（使用uniapp框架）中的运动模块中有个选项卡可以查询附近健身房。我尝试过使用腾讯地图、百度地图和高德地图的api来实现此功能，前两者（腾讯、百度）都以失败告终（无法显示出健身房位置标记），大概是自己菜吧 ????????????。为了使读者们避免踩更多的坑以及记录一下自己怎么实现这个功能，我有必要总结一下。???????????? 2. 实现效果（最后放个演示视频吧）上图，可以看到显示我当前位置的附近有哪些健身房，我自定义了最多显示

微信小程序根据用户当前位置并打开地图选择周边地址，完成外卖地址选择并计算距离

greendx的博客

03-30

2346

小程序腾讯地图定位获取地址相关（外卖）

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

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

03-30

5462

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

uni-app 腾讯地图使用

m0_63064850的博客

06-04

1101

uni-app 腾讯地图使用

微信小程序集成腾讯地图

u013432938的博客

12-16

1456

微信小程序集成腾讯地图，实现用户附近停车位搜索显示

uniapp使用腾讯地图进行地理定位

weixin_59525879的博客

12-25

1302

完成以上步骤后，你就可以在uniapp中使用腾讯地图进行地理定位了。记得在调试时，需要在真机上测试，因为在开发工具上是无法获取定位信息的。在uniapp中使用腾讯地图进行地理定位，你需要先在腾讯地图开放平台申请API密钥，然后可以使用uniapp的插件来访问腾讯地图API。之前，需要先获取定位权限。你可以使用 uni.getSetting 方法来获取用户的权限设置，并根据情况向用户申请定位权限。首先，在项目的 manifest.json 文件中配置需要的插件。然后，在需要使用地理定位的页面中，可以通过。

小程序结合腾讯地图（QQMapWX）SDK做位置周边搜索在地图上展示气泡点，点击气泡展示不同状态

hangGe0111的博客

04-21

6041

1.背景：在微信小程序中，地图上展示一个坐标点周边的医院学校等周边设施，通过地图上气泡的方式。点击气泡展示不同的气泡状态，点击导航跳转到对应气泡点所在的坐标位置。 2.实现思路： 2.1布局：地图全屏展示，地图上的位置tablist展示在地图底部，跳转导航按钮位于地图右上角。因为map属于原生标签，而且层级比较高，所以tablist和按钮都需要通过cover-view和cover-im...