oriolrivera/maps.html

## maps.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0px; padding: 0px }
  #map_canvas { height: 100% }
</style>
<script type="text/javascript"
    src="https://maps.google.com/maps/api/js?sensor=true">
</script>
<script type="text/javascript">
  function initialize() {
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);
var contentString = 'C/ Princesa, 1 Madrid';

var infowindow = new google.maps.InfoWindow({
    content: contentString,
    maxWidth: 200
}); //Creamos el infowindow con el string anteriormente definido y el tamaño maximo que tiene.

var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title:"Ejemplo InfoWindow"
}); //Creamos el markador centrado en la variable que hemos definido antes en nuestro mapa.

google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
}); //Se abre al hacer click
}
</script>
</head>
<body onload="initialize()">
  <div id="map_canvas" style="width: 100%; padding-top: 30%;"></div>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<style type="text/css">
	html { height: 100% }
	body { height: 100%; margin: 0px; padding: 0px }
	#map_canvas { height: 100% }
	</style>
	<script type="text/javascript"
	src="https://maps.google.com/maps/api/js?sensor=true">
	</script>
	<script type="text/javascript">
	function initialize() {
	var latlng = new google.maps.LatLng(-34.397, 150.644);
	var myOptions = {
	zoom: 8,
	center: latlng,
	mapTypeId: google.maps.MapTypeId.ROADMAP
	};
	var map = new google.maps.Map(document.getElementById("map_canvas"),
	myOptions);
	var contentString = 'C/ Princesa, 1 Madrid';

	var infowindow = new google.maps.InfoWindow({
	content: contentString,
	maxWidth: 200
	}); //Creamos el infowindow con el string anteriormente definido y el tamaño maximo que tiene.

	var marker = new google.maps.Marker({
	position: latlng,
	map: map,
	title:"Ejemplo InfoWindow"
	}); //Creamos el markador centrado en la variable que hemos definido antes en nuestro mapa.

	google.maps.event.addListener(marker, 'click', function() {
	infowindow.open(map,marker);
	}); //Se abre al hacer click
	}
	</script>
	</head>
	<body onload="initialize()">
	<div id="map_canvas" style="width: 100%; padding-top: 30%;"></div>
	</body>
	</html>