
Google-Map
Medicare uses Google map, with different color schemes aimed towards web designers and developers.
Example
To enable the map view in your component, add data-gmap="data-gmap" attribute in your HTML element. Next, generate your custom map style in the Google Maps Platform by visiting the Map Styles section, then create a Map ID from the Map Management panel. Once,
your Map ID is ready, include it in your HTML using the data-mapid="YOUR_MAP_ID" attribute. This Map ID is required to properly render Google Maps API v3 with the AdvancedMarkerElement.
Eiffel Tower
Gustave Eiffel's iconic, wrought-iron 1889 tower,
with steps and elevators to observation decks.
<div class="googlemap min-vh-50" data-gmap data-latlng="48.8583701,2.2922873,17" data-scrollwheel="false" data-mapid="a2a07f618947e1cca5b1a9b0" data-icon="../assets/img/icons/map-marker.png" data-zoom="17">
<div class="marker-content py-3">
<h5>Eiffel Tower</h5>
<p>Gustave Eiffel's iconic, wrought-iron 1889 tower,<br> with steps and elevators to observation decks.</p>
</div>
</div>
Example of street view
To enable Street View Panorama mode, simply add the data-theme="streetview" attribute to your HTML element. Additionally, to fully enable through the
Google Maps API, make sure to include the required library streetView in the script tag when loading the Google Maps API. This ensures that the
Street View components and features load correctly.
<div class="googlemap min-vh-50" data-gmap data-latlng="43.0795932,-79.0776385" data-pov='{"heading":180,"pitch":-30}' data-scrollwheel="false" data-icon="../assets/img/icons/map-marker.png" data-zoom="1" data-theme="streetview"></div>
Setup Google Maps
- Get your API key⟶
- Add the script to your page
<script> (g => { var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window; b = b[c] || (b[c] = {}); var d = b.maps || (b.maps = {}), r = new Set(), e = new URLSearchParams, u = () => h || (h = new Promise(async (f, n) => { await (a = m.createElement("script")); e.set("libraries", [...r] + ""); for (k in g) e.set(k.replace(/[A-Z]/g, t => "_" + t[0].toLowerCase()), g[k]); e.set("callback", c + ".maps." + q); a.src = `https://maps.${c}apis.com/maps/api/js?` + e; d[q] = f; a.onerror = () => h = n(Error(p + " could not load.")); a.nonce = m.querySelector("script[nonce]") ? .nonce || ""; m.head.append(a); })); d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n)) })({ key: 'YOUR_API_KEY', v: "weekly", libraries: "marker,streetView" // Libraries to load }); </script>
Have a question? call us now
Need support? Drop us an email
Mon – Sat 07:00 – 21:00
We are open on
brigham and women's hospital
75 francis street, boston ma 02115
General information: 671-732-5500
New Patients: 800-294-9999