GEO

by geolocationmarker on February 18th, 2012

No notes

Syntax: JavaScript

Show lines - Hide lines - Show in textbox - Download

<html>
<head>
<title>Marcadores en google Maps</title>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
<meta http-equiv="content-type" content="text/html" charset="utf-8">
<style type="text/css">
html, body {
 margin: 0px;
padding: 0px;
}
#geomap {
padding:0px;
margin:0px;
}
@media all {
 #geomap {width:90%; height:90%;}
}
@media (max-width: 980) and (min-width:768px) {
 #geomap {width: 980px; height:100%;}
}
@media (min-width: 481px) and (max-width: 768px) {
 #geomap {width: 768px; height:100%;}
}
@media (min-width: 321px) and (max-width: 480px) {
#geomap {width: 480px; height:100%;}
}
@media (max-width: 320px) { 
#geomap {width:320px; height:100%;}
}
</style> 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"> 
</script>
<script>
	function initialize(){	
		function posicion(p){
			latitude = p.coords.latitude;
			longitude = p.coords.longitude;
			alert('Lont/Latitud actual:' + latitude + ' ' + longitude);
			
			//creamos el mapa
			var myLatlng = new google.maps.LatLng(latitude,longitude);
			var myOptions = {
			zoom: 20,
			center:myLatlng,
			mapTypeId:google.maps.MapTypeId.ROADMAP 
			}
		var map = new google.maps.Map(document.getElementById("geoMap"),myOptions);	
		var marker = new google.maps.Marker({
			position:myLatlng,
			map:map,
			title: "Estoy en KMMX"
			});
			
			}
		function manejaerror(errorposicion){
				alert('El intento por obtener la ubicacion fallo' + errorposicion.message);
			}
		navigator.geolocation.getCurrentPosition(posicion,manejaerror);
		
		}
	
</script>

</head>
<body onload="initialize()">
	<div id="geoMap"></div>
</body>
</html>

GEO

Leave a Reply