Basic example
You must define container ID, latitude and longitude of the map's center.
You also can define zoom, width and height. By default, zoom is 15. Width an height in a CSS class will replace these values.
Map types are defined in the mapType property. Allowed values are: roadmap (default), satellite, hybrid and terrain.
Markers · 5 things not to miss in San Francisco
latitude and
longitude are required. You can also attach additional information with details, which will be passed to Event object (e) in the events previously defined.
Markers with click event.
Polylines
The path of the polyline is defined by an array of array of two (latitude and longitude).
The example creates a 3-pixel-wide red polyline showing the path of William Kingsford Smith's first trans-Pacific flight between Oakland, CA, and Brisbane, Australia.
Polygons · Bermuda triangle
The path of a polygon can be defined as an array of google.maps.LatLng objects, or arrays of coordinates, with index 0 and 1 as, respectively,
latitude and
longitude (as in the example).
Also, you can add a GeoJSON Polygon or MultiPolygon path using useGeoJSON: true.
Route between two points
From: Golden Gate Park To: Golden Gate Bridge
You must define two points ( origin and destination) and color, opacity and weight of the route in the map.
Also, you can define a travelMode: driving, bicycling or walking. Default is walking.
Routes (step by step)
From: Golden Gate Park To: Golden Gate Bridge
Same as drawRoute, you must define an
origin,
destination and travelMode. Also, you must define the function that GMaps will call every step in the route.
Map Types (Open Street Map)
You can define many map types from external map services, like OpenStreetMap.
You must define a function called getTileUrl, which returns a tile URL according the coordenates in the map.
