import { Component , Input , OnInit , ViewChild , ElementRef } from '@angular/core' ; declare var google ; @ Component ( { selector : 'app-map' , templateUrl : './map.component.html' , styleUrls : [ './map.component.css' ] } ) export class MapComponent implements OnInit { /**
     * GeoJSON coordinates received from the backend.
     */ @ Input ( ) geojson : string ; /**
     * div contained in the html template in which
     * the map will be rendered.
     */ @ ViewChild ( 'map' ) mapDiv : ElementRef ; constructor ( ) { } ngOnInit ( ) { const mapOptions = { zoomControl : true , mapTypeControl : true , scaleControl : true , streetViewControl : false , rotateControl : true , fullscreenControl : false } ; const map = new google . maps . Map ( this . mapDiv . nativeElement , mapOptions ) ; map . data . addGeoJson ( this . geojson ) ; this . zoom ( map ) ; } param map private zoom ( map ) { const bounds = new google . maps . LatLngBounds ( ) ; map . data . forEach ( feature => this . processPoints ( feature . getGeometry ( ) , bounds . extend , bounds ) ) ; map . fitBounds ( bounds ) ; } param geometry param callback param thisArg private processPoints ( geometry , callback , thisArg ) { if ( geometry instanceof google . maps . LatLng ) { callback . call ( thisArg , geometry ) ; } else if ( geometry instanceof google . maps . Data . Point ) { callback . call ( thisArg , geometry . get ( ) ) ; } else { geometry . getArray ( ) . forEach ( g => { this . processPoints ( g , callback , thisArg ) ; } ) ; } } }