Variables
The front-end tags for Maps are deceptively simple. You can get a fully working Google map with a single tag, pull out all the direct values for a location.
Note: In these examples, we'll assume you've called the field 'myMapField', and are accessing the field against a variable called 'entry'. The exact same methods work for any field setup
Self-Contained Map
As simple as it comes :
{{ entry.myMapField }}
Becomes a fully working GoogleMap with default options for the front-end user. This adds two assets to the page if they've not already been added - our css and javascript assets necessary for the map container.
Note: For more control to set map options, use the craft().squareBitMaps.map() method
Direct Location Variables
You can access all the data for a location by using the individual location variables. Like :
Map Latitude : {{ entry.myMapField.mapLat }}
Map Longitude : {{ entry.myMapField.mapLng }}
Map Zoom Level : {{ entry.myMapField.mapZoom }}
Pin Latitude : {{ entry.myMapField.pinLat }}
Pin Longitude : {{ entry.myMapField.pinLng }}
Which will return something similar to :
Map Latitude : 53.30984973784554 Map Longitude : -4.335521971874982 Map Zoom Level : 5 Pin Latitude : 53.30984973784554 Pin Longitude : -4.335521971874982