snitchbot | Dashboard & Remote Field Sensing

Google Map

Falcon uses Google map with Snazzy Maps, with different color schemes aimed towards web designers and developers.

Example

Eiffel Tower

Gustave Eiffel's iconic, wrought-iron 1889 tower,
with steps and elevators to observation decks.

<div class="googlemap min-vh-50" data-latlng="48.8583701,2.2922873,17" data-scrollwheel="false" data-icon="../../assets/img/icons/map-marker.png" data-zoom="17" data-theme="Default">
  <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>

Javascript

Get your API key⟶

<script src="https:maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async></script>

Map color schemes

Change the value of data-theme='' to any of the followings

Default
Gray
Midnight
Hopper
Beard
AssassianCreed
SubtleGray
Tripitty

Example

With AssassianCreed scheme

Eiffel Tower

Gustave Eiffel's iconic, wrought-iron 1889 tower,
with steps and elevators to observation decks.

<div class="googlemap min-vh-50" data-latlng="48.8583701,2.2922873,17" data-scrollwheel="false" data-icon="../../assets/img/icons/map-marker.png" data-zoom="17" data-theme="AssassianCreed">
  <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

<div class="googlemap min-vh-50" 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>