setCenter无法在angular2-google-maps中工作

发布时间：2020-12-17 08:01:45 所属栏目：安全来源：网络整理

导读：import { GoogleMapsAPIWrapper } from '@agm/core';import { Component,Input } from '@angular/core';@Component({ selector: 'core-map',styleUrls: [ './map.component.scss' ],templateUrl: './map.component.html',})export class MapComponent { cons

import { GoogleMapsAPIWrapper } from '@agm/core';
import { Component,Input } from '@angular/core';

@Component({
  selector: 'core-map',styleUrls: [ './map.component.scss' ],templateUrl: './map.component.html',})
export class MapComponent {
  constructor(
    public gMaps: GoogleMapsAPIWrapper
  ) {}

  public markerClicked = (markerObj) => {
    this.gMaps.setCenter({ lat: markerObj.latitude,lng: markerObj.longitude });
    console.log('clicked',markerObj,{ lat: markerObj.latitude,lng: markerObj.longitude });
  }
}
console output: Object {lat: 42.31277,lng: -91.24892}

也试过panTo同样的结果.

也许它是在Christopher发布他的解决方案后添加的,但是agm-map有一个mapReady事件,它返回可用于访问setCenter()的原始地图对象.

修改原始代码：

import { Component,})
export class MapComponent {
  protected map: any;

  constructor() {}

  protected mapReady(map) {
    this.map = map;
  }

  public markerClicked = (markerObj) => {
    if (this.map)
      this.map.setCenter({ lat: markerObj.latitude,lng: markerObj.longitude });
  }
}

然后将以下内容添加到agm-map

<agm-map (mapReady)="mapReady($event)"></agm-map>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!