{% load i18n static %}
{% load common %}
<body>
<div id="googleMap" style="width:600px;height:600px;"></div>
<script>
function myMap() {
    // The location of Uluru
  var uluru = {lat: {{ latitude }}, lng: {{ longitude }}};
  // The map, centered at Uluru
  var map = new google.maps.Map(
      document.getElementById('googleMap'), {zoom: 6, center: uluru});
  // The marker, positioned at Uluru
  var marker = new google.maps.Marker({position: uluru, map: map});
  var infowindow =  new google.maps.InfoWindow({
        content: ''
    });
  bindInfoWindow(marker, map, infowindow, "<p>{{ address }}</p>");
}
function bindInfoWindow(marker, map, infowindow, html, Ltitle) {
    google.maps.event.addListener(marker, 'mouseover', function() {
            infowindow.setContent(html);
            infowindow.open(map, marker);

    });
    google.maps.event.addListener(marker, 'mouseout', function() {
        infowindow.close();

    });
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key={% MAPS_API_KEY %}&v=3.31&libraries=places&callback=myMap"></script>
</body>
