<!DOCTYPE html>
<html>
<head>
<title>utilizar un mapa de google maps para posicionar una marca y un popup</title>
<script src="https://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
</head>
<body>
<div>
<h1>utilizar un mapa de google maps para posicionar una marca y un popup</h1>
<div id="map_canvas" style="width:700px;height:500px;"></div>
<script type="text/javascript">
var latlng = new google.maps.LatLng(41.375822, 2.177770);
// definimos valor por defecto
var myOptions = { zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
// generamos el mapa
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// añadimos una marca
var marker = new google.maps.Marker({ position: map.getCenter(),
map: map,
title: 'Estatua Cristobal Colon',
icon: 'http://gmaps-samples.googlecode.com/svn/trunk/markers/green/blank.png',
cursor: 'default',
draggable: true
});
// añadimos un popup
var popup = new google.maps.InfoWindow({ content: 'Estatua Cristobal ColonBarcelona (Spain)',
position: map.getCenter()
});
popup.open(map);
</script>
</body>
</html>
Crear cuenta
