Introducción a geolocalización API de JavaScript 606z6w

Herramientas SEO Tamaño del resultado: 668 x 574

<!doctype html>
<html lang="es">
<head>
<meta charset="utf-8">

<title>Introducción a geolocalización  API de JavaScript</title>
</head>
<body>
<style>
html, body, #map-canvas {
   height: 100%;
   margin: 0px;
   padding: 0px
}
</style>

<div id="map-canvas"></div>

<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', mapInitialize);

function mapInitialize() {
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition( set_position_in_google_map );
   } else {
     alert("Tu navegador no soporta el API de geolocalización. Actualiza a un navegador más moderno.");
   }
}
function set_position_in_google_map( position ) {
  var crds = position.coords;
  var mapPosition = new google.maps.LatLng(crds.latitude, crds.longitude);
  var mapOptions = {
    zoom: 15,
    center: mapPosition
  };
  var map = new google.maps.Map(
    document.getElementById('map-canvas'),
    mapOptions
   );
   var infowindow = new google.maps.InfoWindow({
     map: map,
     position: mapPosition,
     content: 'Localización encontrada utilizando Geolocation API.'
   });

}
</script>
<div id="map-canvas"></div>

//este es otro codigo ...................................................

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script>
//<![CDATA[
var x=document.getElementById("demo");
navigator.geolocation.getCurrentPosition(showPosition,showError);
function showPosition(position)
  {
  lat=position.coords.latitude;
  lon=position.coords.longitude;
  latlon=new google.maps.LatLng(lat, lon)
  mapholder=document.getElementById('mapholder')
  mapholder.style.height='250px';
  var myOptions={
  center:latlon,zoom:10,
  mapTypeId:google.maps.MapTypeId.ROAP,
  mapTypeControl:false,
  navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
  };
  var map=new google.maps.Map(document.getElementById("mapholder"),myOptions);
  var marker=new google.maps.Marker({position:latlon,map:map,title:"You are here!"});
  }
function showError(error)
  {
  switch(error.code) 
    {
    case error.PERMISSION_DENIED:
      x.innerHTML="<div class='error'>Denegada la peticion de Geolocalización en el navegador.</div>"
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML="<div class='error'>La información de la localización no esta disponible.</div>"
      break;
    case error.TIMEOUT:
      x.innerHTML="<div class='error'>El tiempo de petición ha expirado.</div>"
      break;
    case error.UNKNOWN_ERROR:
      x.innerHTML="<div class='error'>Ha ocurrido un error desconocido.</div>"
      break;
    }
  }
  //]]>
</script>

</body>
</html>