title: ERROR TypeError: Cannot read property 'panTo' of undefined
body: <p>I am trying to pan to some lat and lng, while panning the above error is getting displayed.
  But it shows the above error.</p>
  
  <p>component.ts</p>
  
  <pre><code>public map: any;
  zoom; 
  lat;
  currentLoc: boolean; 
  lng;
  constructor() {
  
          this.zoom = 12;
          this.lat = 12.972442;
          this.lng = 77.580643;
  
  }
  
   ngOnInit() {
     this.setCurrentPosition();
  }
  
   private setCurrentPosition() {
          console.log('setting');
          this.currentLoc = true;
          if ('geolocation' in navigator) {
              navigator.geolocation.getCurrentPosition((position) =&gt; {
                  this.lat = position.coords.latitude;
                  this.lng = position.coords.longitude;
                  this.zoom = 12;
              });
          }
      }
  
  
  public mapReady(map) {
          this.map = map;
      }`
  
   drawOnMap() {
  for (let i = 0; i &lt; this.Locations.length; i++) {
                          // console.log(this.Locations[i].latitude, this.Locations[i].longitude);
                          const coordinate = new Coordinate(this.Locations[i].latitude, this.Locations[i].longitude);
                          // console.log( 'Coordinate is :' + coordinate);
                          this.coordinates.push(coordinate);
                          this.map.panTo({ lat: this.Locations[0].latitude, lng: this.Locations[0].longitude });
                      }
  }
  </code></pre>
  
  <blockquote>
    <p>this.Locations[] is having some lats and lng, it is not empty</p>
  </blockquote>
  
  <p>Html</p>
  
  <pre><code>&lt;agm-map [latitude]="lat" [longitude]="lng" [zoom]="zoom" [styles]="styles" (mapReady)="mapReady($event)"&gt;
                  &lt;agm-marker *ngFor="let marker of coordinates; let i = index" [iconUrl]="station" [latitude]="marker.latitude" [longitude]="marker.longitude"
                      [markerClickable]="true" (markerClick)="markerClicked(marker.latitude,marker.longitude)"&gt;
                  &lt;/agm-marker&gt;
                  &lt;agm-marker *ngIf="currentLoc === true" [iconUrl]="Liveicon" [latitude]="lat" [longitude]="lng"&gt;
                  &lt;/agm-marker&gt;
  &lt;agm-map&gt;
  </code></pre>
  
  <p>Please correct me where I am wrong. I am not able to get this.</p>