Angular Google Maps components
In this section, we will look at the official Google product component package called Angular Google Maps. The Google Maps API is large, so this package includes both a GoogleMap
component and several other components used to configure and control its many features.
It consists of the following Angular components and directives:
GoogleMap
MapBicyclingLayer
MapCircle
MapGroundOverlay
MapInfoWindow
MapKmlLayer
MapMarker
MapMarkerClusterer
MapPolygon
MapRectangle
MapTrafficLayer
MapTransitLayer
We will explore the necessary component, GoogleMap
, and the commonly used components MapInfoWindow
, MapMarker
, and MapMarkerClusterer
.
Getting started
To use the Angular Google Maps components, we first must load the Google Maps JavaScript API. This example wrapper component illustrates how to conditionally render the Google Maps component after the Google Maps JavaScript API has been initialized...