评论

微信小程序接入腾讯地图并使用教程(完整版)

本文为大家详细讲解如何在微信小程序中接入腾讯地图服务,并使用其提供的各类插件功能,如地图选点、城市选择、地铁图、路线规划等。

本文为大家详细讲解如何在微信小程序中接入腾讯地图服务,并使用其提供的各类插件功能,如地图选点、城市选择、地铁图、路线规划等。


一、开通腾讯位置服务

1. 登录并授权

  1. 登录微信小程序后台,选择 开发 - 开发工具 - 腾讯位置服务。
  2. 点击 开通,进入扫码授权界面,使用微信扫码完成授权。
  3. 如果已有腾讯位置服务账号,可直接绑定。

二、插件申请接入

1. 添加插件

  1. 进入 微信服务市场。
  2. 搜索 腾讯位置服务,选择所需插件(如“地图选点”)。
  3. 点击 添加插件,使用微信扫码确认,完成添加。

2. 查看插件管理

进入微信公众平台后台,选择 设置 - 第三方设置 - 插件管理,即可查看已添加的插件。

3. 示例插件

以下为一些常用插件:

腾讯地图服务地图选点

腾讯位置服务地铁图

腾讯位置服务路线规划


三、申请开发者密钥与开通 WebService API 服务

  1. 访问 腾讯位置服务控制台
  2. 选择 个人中心,完成注册或企业认证。
  3. 在 应用管理 中,创建应用并申请密钥。
  4. 为密钥配置权限,勾选 WebService API 和 微信小程序,并输入小程序的 APPID。

四、使用插件示例:地图选点

1. 引入插件包

app.json 中添加:

2. 设置定位授权

app.json 中添加定位权限:

3. 使用示例代码

页面代码

demo.wxml

demo.js

五、使用插件示例:城市选择

1. 引入插件包

app.json 中添加:

2. 设置定位授权

添加模糊定位权限:

3. 使用示例代码

页面代码

city.wxml

city.js

六、使用插件示例:地铁图

1. 引入插件包

app.json 中添加:

2. 使用示例代码

页面代码

subway.wxml

subway.js

七、使用插件示例:路线规划

1. 引入插件包

app.json 中添加:

2. 使用示例代码

页面代码

plan.wxml

plan.js

最后一次编辑于  6小时前  
点赞 1
收藏
评论

1 个评论

  • 斯迈华
    斯迈华
    6小时前

    本文为大家详细讲解如何在微信小程序中接入腾讯地图服务,并使用其提供的各类插件功能,如地图选点、城市选择、地铁图、路线规划等。

    6小时前
    赞同
    回复
登录 后发表内容