这篇文章主要介绍了微信小程序 接入腾讯地图的两种写法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

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

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

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

一、调用腾讯本身的地图

实现结果如下图:

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第1张

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

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

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第2张

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

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

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第3张

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

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第4张

点击

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第5张

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

以上就是第一种方法,

二、第二种方法

首先找到微信小程序的

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第6张

在插件管理中添加该插件

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第7张

使用方法:

首先在app.json文件中配置

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第8张

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

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第9张

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

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

代码如下:

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第10张

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第11张

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第12张

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第13张

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

微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)  小程序 接入腾讯地图 微信小程序接入腾讯地图 第14张

到此这篇关于微信小程序 接入腾讯地图的两种写法的文章就介绍到这了,更多相关小程序 接入腾讯地图内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
  • 微信小程序 腾讯地图SDK 获取当前地址实现解析
  • 微信小程序 腾讯地图显示偏差问题解决
  • 微信小程序把百度地图坐标转换成腾讯地图坐标过程详解
  • 微信小程序+腾讯地图开发实现路径规划绘制
  • 微信小程序 使用腾讯地图SDK详解及实现步骤
转载请说明出处
知优网 » 微信小程序 接入腾讯地图的两种写法(微信小程序引入地图)

发表评论

您需要后才能发表评论