Angular引入百度地圖js
第一步:申請百度地圖金鑰,很簡單,去網上隨便找教程
第二步:在Angular專案中引入百度地圖API檔案,在index.html中引入
第三部,建立一個元件
html部分
<div id = "map" style="width:100%;height: 100%"></div>
js部分
import { Component,OnInit } from '@angular/core';
import { NavController,NavParams } from 'ionic-angular';
declare var BMap: any;
@Component({
selector: 'page-map',
templateUrl: 'map.html'
})
export class MapPage {
thisX = "";
thisY = "";
constructor(public navCtrl: NavController,public params:NavParams) {
this.thisX = this.params.get('x');
this.thisY = this.params.get('y');
}
ngOnInit() {
const map = new BMap.Map('map');//建立地圖例項
const point = new BMap.Point(this.thisX,this.thisY);//建立點座標
map.centerAndZoom(point, 15);//初始化地圖,設定中心點座標和地圖級別
map.enableScrollWheelZoom(true);//開啟滑鼠滾輪縮放
console.log(map);
}
}
執行就可以看到地圖了