小程序模板:专业的小程序模板与静态模板分享平台
小程序
教程
搜索
当前位置 : 首页> 小程序教程> uniapp小程序使用高德地图步骤

uniapp小程序使用高德地图步骤

以下是在uniapp中使用高德地图的步骤:

1. 首先需要在高德地图官网申请一个属于自己的高德地图key。

2. 在uniapp项目中安装高德地图插件,可以使用以下命令进行安装:

npm install --save uni-simple-router
npm install --save uview-ui
npm install --save uview-ui

3. 在需要使用高德地图的页面中引入高德地图插件

import amap from '@/components/amap/amap.vue'

4. 在页面中使用高德地图插件: 


 


其中,key为你在高德地图官网申请的key,longitude和latitude为地图的中心点坐标,markers为标记点的信息。 

5. 在manifest.json文件中添加高德地图插件的配置: 

{
  "mp-weixin": {
    "plugins": {
      "amap": {
        "version": "1.0.0",
        "provider": "wx92c75a9e3b8e6c8e"
      }
    }
  }
}

其中,provider为高德地图插件的提供商。

联系客服 意见反馈

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了