1.首先你要有一个高德地图的key
2.在index.html中引入高德地图
3.文件中写
4.xxx.page.tsimport { Component , ViewChild, ElementRef} from '@angular/core';
declare var AMap; @Component({ selector: 'app-tab2', templateUrl: 'tab2.page.html', styleUrls: ['tab2.page.scss'] })
export class Tab2Page { @ViewChild('map_container') map_container: ElementRef; map: any;//地图对象
ionViewDidEnter() {
this.map = new AMap.Map(this.map_container.nativeElement, {
view: new AMap.View2D({//创建地图二维视口
zoom: 11, //设置地图缩放级别
rotateEnable: true,
showBuildingBlock: true
})
});
}
} 5.xxx.page.sass
body,.map_container { width: 100%; height: 600px; overflow:hidden; margin:0; z-index:1000 } 就成功啦~