@amap/amap-jsapi-loader

amap-jsapi-loader

amap-jsapi-loader 是高德开放平台官网提供的地图 JSAPI 的加载器，可帮助开发者快速定位、有效避免加载引用地图 JSAPI 各种错误用法。

该加载器具有以下特性：

• 支持以 普通JS 和 npm包 两种方式使用；
• 有效避免错误异步加载导致的 JSAPI 资源加载不完整问题；
• 对于加载混用多个版本 JSAPI 的错误用法给予报错处理；
• 对于不合法加载引用 JSAPI 给予报错处理；
• 支持指定 JSAPI 版本；
• 支持插件加载；
• 允许多次执行加载操作，网络资源不会重复请求，便于大型工程模块管理；

AMapLoader.load方法参数说明

AMapLoader.load({
    "key": "",            // 申请好的Web端开发者Key，首次调用 load 时必填
    "version": "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
    "plugins": []         // 需要使用的的插件列表，如比例尺'AMap.Scale'等
}).then((AMap)=>{});

使用

以普通 JS 方式使用 Loader

参考 example/example.html

<script src="https://webapi.amap.com/loader.js"></script>
<script>
    AMapLoader.load({
        key:'',//首次load必填
        version:'2.0',
        plugins:['AMap.Scale']
    }).then((AMap)=>{
        map = new AMap.Map('container');
        map.addControl(new AMap.Scale())
    }).catch((e)=>{
        console.error(e);
    });   
</script>

以 NPM 包方式使用 Loader

安装

tnpm i @amap/amap-jsapi-loader --save-dev

使用

import AMapLoader from '@amap/amap-jsapi-loader';

AMapLoader.load().then((AMap)=>{
    map = new AMap.Map('container');
}).catch(e=>{
    console.log(e);
})

相关链接：

地               图 JSAPI：   示例中心    教程    参考手册

数据可视化 JSAPI：   示例中心    教程    参考手册