yangyin
2024-07-17 349020eb32ec1c8589b568b767b674df71075e80
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
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)
    }
}