setCenter not working in angular2-google-maps

Question

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

@Component({
  selector: \'core-map\',
  styleUrls: [ \'./map.co         


        

Answer 1

Perhaps it's been added since Christopher posted his solution, but agm-map has a mapReady event that returns the raw map object that you can use to access setCenter().

Modification of your original code:

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

@Component({
  selector: 'core-map',
  styleUrls: [ './map.component.scss' ],
  templateUrl: './map.component.html',
})
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 });
    console.log('clicked', markerObj, { lat: markerObj.latitude, lng: markerObj.longitude });
  }
}

Then add the following to agm-map