ng-bdmap

介绍

百度地图的简单封装，适用于Angular2以上版本

安装

npm install ng-bdmap --save

使用

app.module.ts

import { NgBDMapModule } from 'ng-bdmap';


@NgModule({
  imports: [
    ...
    NgBDMapModule.forRoot( {ak:'你的KEY'}),
  ],

API

和百度地图API使用方法一致，但实例化不需要使用 new

范例

import { Component, ViewChild, AfterViewInit }  from '@angular/core';
import { NgBDMap, BMAP_ANCHOR_TOP_LEFT } from 'ng-bdmap';

@Component({
  selector: 'baidu-map-component',
  template: `<div #container style="width:500px;height:300px;"></div>`
})
export class BDMapComponent implements AfterViewInit {
  constructor(
    private BMap: NgBDMap
  ) {}

  @ViewChild( 'container' ) container:any;

  ngAfterViewInit() {
    let map = this.BMap.Map( this.container.nativeElement );
    map.centerAndZoom(this.BMap.Point(116.404, 39.915), 11);

    let topLeftControl = this.BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});
	map.addControl(topLeftControl );        
  }
}