import AMapLoader from '@amap/amap-jsapi-loader';
|
import _ from 'lodash';
|
|
export type AMapInstance = typeof AMap;
|
export type GaoDePosition = [number, number];
|
export type GaoDeMapOption = {
|
key?: string;
|
version?: string;
|
plugins?: string[];
|
container: string | HTMLDivElement;
|
aMapOption?: Partial<AMap.MapOptions>;
|
};
|
|
export class GaoDeMap {
|
map: AMap.Map;
|
private viewBound: AMap.Bounds;
|
async init(option: GaoDeMapOption) {
|
const gaoDeOption = _.defaultsDeep(option, {
|
key: '3627ed9deaac2622e26a7169f0c36b1b', // 申请好的Web端开发者Key,首次调用 load 时必填
|
version: '2.0', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
|
plugins: [
|
'AMap.ToolBar',
|
'AMap.Scale',
|
// 'AMap.HawkEye',
|
// 'AMap.MapType',
|
// 'AMap.MouseTool',
|
// 'AMap.MarkerCluster',
|
// 'AMap.InfoWindow',
|
], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
|
aMapOption: {
|
viewMode: '2D', //默认使用 2D 模式
|
zoom: 5, //地图级别
|
center: [116.397428, 39.90923], //地图中心点
|
} as Partial<AMap.MapOptions>,
|
} as Partial<GaoDeMapOption>) as GaoDeMapOption;
|
try {
|
const AMap = await AMapLoader.load({
|
key: gaoDeOption.key,
|
version: gaoDeOption.version,
|
plugins: gaoDeOption.plugins,
|
});
|
this.map = new AMap.Map(gaoDeOption.container, gaoDeOption.aMapOption);
|
} catch (error) {
|
// console.error(error);
|
}
|
}
|
constructor() {}
|
|
zoomToRect(southWest: GaoDePosition, northEast: GaoDePosition) {
|
if (!this.viewBound) {
|
this.viewBound = new AMap.Bounds(southWest, northEast);
|
} else {
|
this.viewBound.northEast = new AMap.LngLat(northEast[0], northEast[1]);
|
this.viewBound.southWest = new AMap.LngLat(southWest[0], southWest[1]);
|
}
|
this.map.setBounds(this.viewBound);
|
}
|
|
|
applyBasicPlugins(){
|
// const scale = new AMap.Scale();
|
// this.map.addControl(scale)
|
// const toolbar = new AMap.ToolBar();
|
// this.map.addControl(toolbar)
|
}
|
}
|