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>
|
|
|