diff --git a/src/app/routes/supply-management/components/gaode-map/gaode-map.component.ts b/src/app/routes/supply-management/components/gaode-map/gaode-map.component.ts index f95d253d..8ef17fa1 100644 --- a/src/app/routes/supply-management/components/gaode-map/gaode-map.component.ts +++ b/src/app/routes/supply-management/components/gaode-map/gaode-map.component.ts @@ -4,6 +4,7 @@ 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'; +declare var AMapUI: any; @Component({ selector: 'app-gaode-map', templateUrl: './gaode-map.component.html' @@ -25,12 +26,15 @@ export class GaodeMapComponent implements OnInit, OnDestroy { } mapInit() { + console.log(AMapLoader); + AMapLoader.load({ // 首次调用 load key: '63f9573ca55fef2b92d4ffe0c85dea8f', // 申请好的Web端开发者Key,首次调用 load 时必填 version: '2.0', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15 plugins: [ // 需要使用的的插件列表,如比例尺'AMap.Scale'等 + 'AMap.SimpleMarker', 'AMap.Scale', 'AMap.ToolBar', 'AMap.MapType', @@ -40,7 +44,7 @@ export class GaodeMapComponent implements OnInit, OnDestroy { AMapUI: { // 是否加载 AMapUI,缺省不加载 version: '1.1', // AMapUI 缺省 1.1 - plugins: [] // 需要加载的 AMapUI ui插件 + plugins: ['overlay/SimpleMarker'] // 需要加载的 AMapUI ui插件 }, Loca: { // 是否加载 Loca, 缺省不加载 @@ -50,12 +54,21 @@ export class GaodeMapComponent implements OnInit, OnDestroy { .then(AMap => { console.log(AMap); - this.aMap = new AMap.Map('container', { - viewMode: '2D', // 默认使用 2D 模式,如果希望使用带有俯仰角的 3D 模式,请设置 viewMode: '3D', - zoom: 16 - }); + this.aMap = new AMap.Map('container'); + console.log(this.aMap); + this.aMap.on('complete', () => { this.service.msgSrv.info('地图加载完成 !'); + new AMapUI.SimpleMarker({ + //前景文字 + iconLabel: 'A', + //图标主题 + iconTheme: 'default', + //背景图标样式 + iconStyle: 'red', + map: this.aMap, + position: this.aMap.getCenter() + }); }); }) .catch(e => {