8 sept 2008

Google Maps I

El registro en el API de Google Maps se realiza en esta dirección:

http://code.google.com/intl/es/apis/maps/signup.html



La clave que se genera está asociada a una URL y una cuenta de Google. Para la cuenta de correo asociada a este blog y la dirección de este blog la clave es:

ABQIAAAAotXQJpg3sFlApzXb0ImjlxRksZB8kCCIBY2vpWkXqt2HhCnw7hQO7vzidhFs3Sy48c0aci-G6tdTYg

Una vez que tenemos la dirección podemos usar el API de Google Maps en una de sus dos versiones:


  • API de Google Maps, http://code.google.com/intl/es/apis/maps/documentation/

  • API de Google Static Maps, http://code.google.com/intl/es/apis/maps/documentation/staticmaps/



Direcciones de interés relacionadas con el API de Google Maps:


  • blog oficial, http://googlemapsapi.blogspot.com/

  • blog no oficial, http://googlemapsapi.blogspot.com/

  • blog de desarrolladores, http://googlegeodevelopers.blogspot.com/



Integrar un mapa estático (como imagen)



Puntos de interés en Granada




<img border="0"
src="http://maps.google.com/staticmap?
center=37.168798,-3.596992
&zoom=11&size=300x300&maptype=mobile&
markers=37.231576,-3.552597,bluev%7C
37.120821,-3.605533,greeno%7C
37.225784,-3.681858,reda
&sensor=false&
key=ABQIAAAAotXQJpg3sFlApzXb0ImjlxRksZB8kCCIBY2vpWkXqt2HhCnw7hQO7vzidhFs3Sy48c0aci-G6tdTYg"
alt="Puntos de interés en Granada" />


Integrar un mapa de Api Google Maps






<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<title>mapas</title>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=true&key=ABQIAAAAotXQJpg3sFlApzXb0ImjlxRksZB8kCCIBY2vpWkXqt2HhCnw7hQO7vzidhFs3Sy48c0aci-G6tdTYg" type="text/javascript"></script>
<script type="text/javascript">
    //<![CDATA[
    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.setMapType(G_HYBRID_MAP);
        map.setCenter(new GLatLng(37.223703, -3.681107), 18);
        map.setUIToDefault();
      }
    }
    //]]>
</script>
 </head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 400px; height: 400px"></div> 
</body> 
</html>
Etiquetas: