66 lines
1.9 KiB
TypeScript
66 lines
1.9 KiB
TypeScript
import { Component, Input, OnInit, Output, EventEmitter, OnDestroy } from '@angular/core';
|
||
import { _HttpClient } from '@delon/theme';
|
||
import { load } from '@amap/amap-jsapi-loader';
|
||
import { BaseService } from 'src/app/shared/services';
|
||
import { throwError } from 'rxjs';
|
||
import AMapLoader from '@amap/amap-jsapi-loader';
|
||
@Component({
|
||
selector: 'app-gaode-map',
|
||
templateUrl: './gaode-map.component.html'
|
||
})
|
||
export class GaodeMapComponent implements OnInit, OnDestroy {
|
||
addressInput: any;
|
||
|
||
aMap: any;
|
||
constructor(private service: BaseService) {}
|
||
ngOnInit(): void {
|
||
this.mapInit();
|
||
// this.PoiPicker();
|
||
}
|
||
|
||
ngOnDestroy(): void {
|
||
if (this.aMap) {
|
||
this.aMap.destroy();
|
||
}
|
||
}
|
||
|
||
mapInit() {
|
||
AMapLoader.load({
|
||
// 首次调用 load
|
||
key: '63f9573ca55fef2b92d4ffe0c85dea8f', // 申请好的Web端开发者Key,首次调用 load 时必填
|
||
version: '2.0', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
|
||
plugins: [
|
||
// 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
||
'AMap.Scale',
|
||
'AMap.ToolBar',
|
||
'AMap.MapType',
|
||
'AMap.Driving',
|
||
'AMap.Geolocation'
|
||
],
|
||
AMapUI: {
|
||
// 是否加载 AMapUI,缺省不加载
|
||
version: '1.1', // AMapUI 缺省 1.1
|
||
plugins: [] // 需要加载的 AMapUI ui插件
|
||
},
|
||
Loca: {
|
||
// 是否加载 Loca, 缺省不加载
|
||
version: '2.0' // Loca 版本,缺省 1.3.2
|
||
}
|
||
})
|
||
.then(AMap => {
|
||
console.log(AMap);
|
||
|
||
this.aMap = new AMap.Map('container', {
|
||
viewMode: '2D', // 默认使用 2D 模式,如果希望使用带有俯仰角的 3D 模式,请设置 viewMode: '3D',
|
||
zoom: 16
|
||
});
|
||
this.aMap.on('complete', () => {
|
||
this.service.msgSrv.info('地图加载完成 !');
|
||
});
|
||
})
|
||
.catch(e => {
|
||
throwError(e);
|
||
});
|
||
}
|
||
}
|