You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
91 lines
2.6 KiB
91 lines
2.6 KiB
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> |
|
<title>Google Maps</title> |
|
|
|
<style type="text/css"> |
|
html, body { |
|
height: 100%; |
|
margin: 0; |
|
padding: 0; |
|
} |
|
#map { |
|
height: 100%; |
|
} |
|
</style> |
|
|
|
<script type="text/javascript"> |
|
var language = window.sankore ? sankore.locale().substr(0,2) : "en"; |
|
|
|
function initMap() |
|
{ |
|
var map; |
|
var mapType = null; |
|
|
|
// Default map type can be ROADMAP, SATELLITE, HYBRID or TERRAIN |
|
var defaultMapType = google.maps.MapTypeId.HYBRID; |
|
|
|
var lat = 46.2; |
|
var lng = 6.14; |
|
var zoom = 4; |
|
|
|
|
|
var position = new google.maps.LatLng(lat, lng); |
|
|
|
if (window.sankore) { |
|
lat = parseFloat(window.sankore.preference('latitude', lat)); |
|
lng = parseFloat(window.sankore.preference('longitude', lng)); |
|
zoom = parseFloat(window.sankore.preference('zoom', zoom)); |
|
mapType = window.sankore.preference('mapTypeId', mapType); |
|
|
|
position = new google.maps.LatLng(lat, lng); |
|
}; |
|
|
|
|
|
map = new google.maps.Map(document.getElementById('map'), { |
|
center: position, |
|
zoom: zoom, |
|
mapTypeId: mapType ? mapType : defaultMapType |
|
}); |
|
|
|
|
|
if (window.sankore) { |
|
map.addListener('zoom_changed',function() |
|
{ |
|
window.sankore.setPreference('zoom', map.getZoom()); |
|
}); |
|
|
|
map.addListener('dragend',function() |
|
{ |
|
window.sankore.setPreference('latitude', map.getCenter().lat()); |
|
window.sankore.setPreference('longitude', map.getCenter().lng()); |
|
}); |
|
|
|
map.addListener('maptypeid_changed',function() |
|
{ |
|
window.sankore.setPreference('mapTypeId', map.getMapTypeId()); |
|
}); |
|
} |
|
|
|
window.onresize(); |
|
} |
|
|
|
window.onresize = function() |
|
{ |
|
document.getElementById('map').style.width = window.innerWidth + 'px'; |
|
document.getElementById('map').style.height = window.innerHeight + 'px'; |
|
}; |
|
|
|
</script> |
|
</head> |
|
|
|
<body> |
|
<div id="map" style="width: 800px; height: 600px"></div> |
|
</body> |
|
|
|
<script> |
|
// language has to be set in the URL, hence this way of loading the API |
|
document.write('\x3Cscript src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBjqhXNSem9YdHR2GAb8zx0qHl4S1RsKxE&callback=initMap&language='+language+'">\x3C/script>'); |
|
</script> |
|
</html>
|
|
|