mikejakobsen/Maps

## Maps
<!DOCTYPE html>
<html>
  <head>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
	<meta charset="utf-8">
	<title>Info window with <code>maxWidth</code></title>
	<style>
	  html, body {
		height: 100%;
		margin: 0;
		padding: 0;
	  }
	  #map {
		height: 100%;
	  }
	</style>
  </head>
  <body>
	<div id="map"></div>
<script>

// This example displays a marker at the center of Australia.
// When the user clicks the marker, an info window opens.
// The maximum width of the info window is set to 200 pixels.

function initMap() {
	var infoWindow = new google.maps.InfoWindow({map: map});

	if (navigator.geolocation) {
		navigator.geolocation.getCurrentPosition(function(position) {
			var pos = {
			lat: position.coords.latitude,
				lng: position.coords.longitude
			};

			infoWindow.setPosition(pos);
			infoWindow.setContent('Her er jeg.');
			map.setCenter(pos);
		  }, function() {
			  handleLocationError(true, infoWindow, map.getCenter());
		  });
		} else {
			// Browser doesn't support Geolocation
			handleLocationError(false, infoWindow, map.getCenter());
		}
		function handleLocationError(browserHasGeolocation, infoWindow, pos) {
			infoWindow.setPosition(pos);
			infoWindow.setContent(browserHasGeolocation ?
				'Error: The Geolocation service failed.' :
				'Error: Your browser doesn\'t support geolocation.');
	  }

	var myLatLng = {lat: -25.363, lng: 131.044};
	var uluru = {lat: -25.363, lng: 131.044};
	var map = new google.maps.Map(document.getElementById('map'), {
	zoom: 4,
		center: {lat: position.coords.latitude, lng: position.coords.longitude}
		});


		var contentString = '<div id="content">'+
			'<div id="siteNotice">'+
			'</div>'+
			'<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+
			'<div id="bodyContent">'+
			'<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large ' +
			'sandstone rock formation in the southern part of the '+
			'Northern Territory, central Australia. It lies 335&#160;km (208&#160;mi) '+
			'south west of the nearest large town, Alice Springs; 450&#160;km '+
			'(280&#160;mi) by road. Kata Tjuta and Uluru are the two major '+
			'features of the Uluru - Kata Tjuta National Park. Uluru is '+
			'sacred to the Pitjantjatjara and Yankunytjatjara, the '+
			'Aboriginal people of the area. It has many springs, waterholes, '+
			'rock caves and ancient paintings. Uluru is listed as a World '+
			'Heritage Site.</p>'+
			'<p>Attribution: Uluru, <a href="https://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+
			'https://en.wikipedia.org/w/index.php?title=Uluru</a> '+
			'(last visited June 22, 2009).</p>'+
			'</div>'+
			'</div>';

		var infowindow = new google.maps.InfoWindow({
		content: contentString,
			maxWidth: 200
		});

		 var marker = new google.maps.Marker({
		 position: myLatLng,
			 map: map,
			 title: 'Hello World!'
		});

		var marker = new google.maps.Marker({
		position: uluru,
			map: map,
			title: 'Uluru (Ayers Rock)'
		});
		marker.addListener('click', function() {
			infowindow.open(map, marker);
		});
	  }
	</script>
	<script async defer
	src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
	</script>
  </body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
	<meta charset="utf-8">
	<title>Info window with <code>maxWidth</code></title>
	<style>
	html, body {
	height: 100%;
	margin: 0;
	padding: 0;
	}
	#map {
	height: 100%;
	}
	</style>
	</head>
	<body>
	<div id="map"></div>
	<script>

	// This example displays a marker at the center of Australia.
	// When the user clicks the marker, an info window opens.
	// The maximum width of the info window is set to 200 pixels.

	function initMap() {
	var infoWindow = new google.maps.InfoWindow({map: map});

	if (navigator.geolocation) {
	navigator.geolocation.getCurrentPosition(function(position) {
	var pos = {
	lat: position.coords.latitude,
	lng: position.coords.longitude
	};

	infoWindow.setPosition(pos);
	infoWindow.setContent('Her er jeg.');
	map.setCenter(pos);
	}, function() {
	handleLocationError(true, infoWindow, map.getCenter());
	});
	} else {
	// Browser doesn't support Geolocation
	handleLocationError(false, infoWindow, map.getCenter());
	}
	function handleLocationError(browserHasGeolocation, infoWindow, pos) {
	infoWindow.setPosition(pos);
	infoWindow.setContent(browserHasGeolocation ?
	'Error: The Geolocation service failed.' :
	'Error: Your browser doesn\'t support geolocation.');
	}

	var myLatLng = {lat: -25.363, lng: 131.044};
	var uluru = {lat: -25.363, lng: 131.044};
	var map = new google.maps.Map(document.getElementById('map'), {
	zoom: 4,
	center: {lat: position.coords.latitude, lng: position.coords.longitude}
	});



	var contentString = '<div id="content">'+
	'<div id="siteNotice">'+
	'</div>'+
	'<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+
	'<div id="bodyContent">'+
	'<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large ' +
	'sandstone rock formation in the southern part of the '+
	'Northern Territory, central Australia. It lies 335 km (208 mi) '+
	'south west of the nearest large town, Alice Springs; 450 km '+
	'(280 mi) by road. Kata Tjuta and Uluru are the two major '+
	'features of the Uluru - Kata Tjuta National Park. Uluru is '+
	'sacred to the Pitjantjatjara and Yankunytjatjara, the '+
	'Aboriginal people of the area. It has many springs, waterholes, '+
	'rock caves and ancient paintings. Uluru is listed as a World '+
	'Heritage Site.</p>'+
	'<p>Attribution: Uluru, <a href="https://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+
	'https://en.wikipedia.org/w/index.php?title=Uluru</a> '+
	'(last visited June 22, 2009).</p>'+
	'</div>'+
	'</div>';

	var infowindow = new google.maps.InfoWindow({
	content: contentString,
	maxWidth: 200
	});

	var marker = new google.maps.Marker({
	position: myLatLng,
	map: map,
	title: 'Hello World!'
	});

	var marker = new google.maps.Marker({
	position: uluru,
	map: map,
	title: 'Uluru (Ayers Rock)'
	});
	marker.addListener('click', function() {
	infowindow.open(map, marker);
	});
	}
	</script>
	<script async defer
	src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
	</script>
	</body>
	</html>