引入高德地图并且同时加载多个插件

455 阅读1分钟

一、普通js引入方式

<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=222&plugin=AMap.DistrictSearch,AMap.MouseTool">
</script>

plugin后面有多个插件逗号分隔即可。
plugin=AMap.DistrictSearch,AMap.MouseTool

二、响应式框架的方式(Vue、Angular、React)

 let AMap = await load({
      "key": "fc901281c15123f4e4b9e50a1ce93b4a",      // 申请好的Web端开发者Key,首次调用 load 时必填
      "version": "1.4.15",   // 2.0的没有marker动画效果只有1.4.15的才有 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
      "plugins": ['AMap.DistrictSearch', 'AMap.MarkerClusterer', 'AMap.ToolBar', "AMap.DistrictLayer"],           // 需要使用的的插件列表,如比例尺'AMap.Scale'等
      AMapUI: {             // 是否加载 AMapUI,缺省不加载
        "version": '1.1',   // AMapUI 缺省 1.1
        "plugins": ['geo/DistrictCluster'],       // 需要加载的 AMapUI ui插件
      }
    })