JS 如何调用高德地图

微微一笑绝绝子

已于 2022-07-20 14:14:45 修改

阅读量3k

点赞数 1

文章标签： javascript 前端 vue.js 开发语言 ecmascript

于 2021-08-25 10:02:00 首次发布

本文链接：https://blog.csdn.net/wwyxjjz/article/details/125845845

版权

最近配合后台做管理系统，需要前端用原生html页面嵌入到后台，于是乎...记录下原生JS怎么使用高德地图吧

一.获取高德地图的key

获取地址：高德开放平台https://lbs.amap.com/

1.手机号登录高德开放平台

3、选择web服务，然后提交，就会生成key的值

二.定义放地图的容器，并设置宽高

  <style>
    #oneMap {
      width: 100%;
      height: 800px;
    }
  </style>

<div id="oneMap"></div>

注意：容器的ID 和第三步初始化地图的 ID保持一致

三.在线加载 JSAPI以及地图初始化

<script type="text/javascript"
    src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值"></script>

// 地图初始化
<script type="text/javascript">
    var map

关注