Google Maps

Basic example 




<agm-map [latitude]="map.lat" [longitude]="map.lng" style="height: 300px">
  <agm-marker [latitude]="map.lat" [longitude]="map.lng"></agm-marker>
</agm-map>
                    

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

@Component({
  selector: 'map-example',
  templateUrl: 'map.html',

}) 

export class MapComponent {
    public map: any = { lat: 51.678418, lng: 7.809007 };
}

Add AgmCoreModule.forRoot({ apiKey: 'your key here' }) in the imports declarations, in the app.module.ts file to see the map (get an API key here).


@NgModule({
  imports: [
    AgmCoreModule.forRoot({
      apiKey: 'your key here'
    })
  ],
})