网络编程 
首页 > 网络编程 > 浏览文章

微信小程序 接入腾讯地图的两种写法

(编辑:jimmy 日期: 2025/1/28 浏览:3 次 )

最近在写微信小程序,遇到了一些坑,在网上也查了好多,感觉都没有我想要的答案,

刚处理了这个地图的问题,在这里总结下,希望可以帮助大家。

在微信小程序中,腾讯地图的接入其实是有两种方式的,第一种调用腾讯本身的地图,第二种是使用插件 ma-route

一、调用腾讯本身的地图

实现结果如下图:

微信小程序 接入腾讯地图的两种写法

这个非常简单,而且用的人也很多,

只需要调用两个地图的api.

微信小程序 接入腾讯地图的两种写法

就是上边的两个。当然调用openLocation的时候你首先要调用getLocation授权

需要你在app.json里配置信息,如下:

微信小程序 接入腾讯地图的两种写法

在你需要跳转地图的页面写以下方法:

微信小程序 接入腾讯地图的两种写法

点击

微信小程序 接入腾讯地图的两种写法

可以弹出百度地图,高德地图等第三方软件

以上就是第一种方法,

二、第二种方法

首先找到微信小程序的

微信小程序 接入腾讯地图的两种写法

在插件管理中添加该插件

微信小程序 接入腾讯地图的两种写法

使用方法:

首先在app.json文件中配置

微信小程序 接入腾讯地图的两种写法

其次在它所在目录的main.json文件配置

微信小程序 接入腾讯地图的两种写法

我是基于mpvue写的,所以和开发文档上稍有区别

先有跳转过来的页面拿到终点地址,然后通过getLocation获取当前位置坐标

代码如下:

微信小程序 接入腾讯地图的两种写法

微信小程序 接入腾讯地图的两种写法

微信小程序 接入腾讯地图的两种写法

微信小程序 接入腾讯地图的两种写法

以下是第二种方法:成功后的效果图

微信小程序 接入腾讯地图的两种写法

上一篇:Vue页面渲染中key的应用实例教程
下一篇:使用Typescript开发微信小程序的步骤详解
一句话新闻
一文看懂荣耀MagicBook Pro 16
荣耀猎人回归!七大亮点看懂不只是轻薄本,更是游戏本的MagicBook Pro 16.
人们对于笔记本电脑有一个固有印象:要么轻薄但性能一般,要么性能强劲但笨重臃肿。然而,今年荣耀新推出的MagicBook Pro 16刷新了人们的认知——发布会上,荣耀宣布猎人游戏本正式回归,称其继承了荣耀 HUNTER 基因,并自信地为其打出“轻薄本,更是游戏本”的口号。
众所周知,寻求轻薄本的用户普遍更看重便携性、外观造型、静谧性和打字办公等用机体验,而寻求游戏本的用户则普遍更看重硬件配置、性能释放等硬核指标。把两个看似难以相干的产品融合到一起,我们不禁对它产生了强烈的好奇:作为代表荣耀猎人游戏本的跨界新物种,它究竟做了哪些平衡以兼顾不同人群的各类需求呢?
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网 网站地图 SiteMap