Mapas de Google Maps sencillos.

Hoy he visto en los RSS que anieto2k comentaba algo sobre Phoogle. Me ha dado por bajarme el pequeño código de la web de Phoogle y he visto que estaba bien la cosa, era sencillito de manejar.

Lo que pasa es que, como ahora estoy con el GPS bluetooth nuevo muy entretenido, he pensado que le faltaba una herramienta para poder usar los paseos que me doy con el GPS en marcha y pasarlos de forma sencilla a un mapa en la web.

Pues bien, me he puesto a programar un poco (que ultimamente programo poco en el curro y me apetece) y he implementado un sistema bastante sencillo para mostrar rutas, obtener posiciones geográficas y alguna cosilla más.

He tenido que modificar bastante el código de Phoogle, así que publico directamente aquí mi versión, ya que no creo que el autor quiera implementar según que cosas.

Vamos a por los ejemplos, que es lo que interesa.

Enlaces simples:

En estos enlaces simples, podemos pasarle en la url la latitud y la longitud de lo que queremos ver. Si arrastramos el mapa en cualquier momento, obtendremos la información de la latitud y la longitud que estamos viendo en ese momento. Además, tenemos un “Enlaza este sitio” muy cómo para usar el “copiar / pegar”.

Enlaces con puntos marcados
Se pueden marcar puntos en el mapa de una forma muy sencilla, el código sería algo como esto:

$myPhoogleMap->addGeoPoint("39.836","3.169","Texto HTML de ejemplo");

Por ejemplo:

Metiendo rutas
Vamos a lo interesante. Esto es una de las cosas que más me apetecía. Meter de forma sencilla las coordenadas que me da el GPS (cuando he guardado un paseo) y poder mostrarlas de forma sencilla en pantalla.

Un paseo corto sería algo como:

$myPhoogleMap->addTrack("0000CC");
$myPhoogleMap->addPolyline("39.839172093", "3.164405822753");
$myPhoogleMap->addPolyline("39.8392050453", "3.16515684127");
$myPhoogleMap->addPolyline("39.839172093", "3.16586494445");
$myPhoogleMap->addPolyline("39.840803215", "3.16816091537");
$myPhoogleMap->addPolyline("39.84108330349", "3.167967796325");

Pero además, como este paseo es cerca de la playa, queda más bonito usar las imágenes de satélite y con el zoom al máximo, así que añadimos:

$myPhoogleMap->zoomLevel=1;
$myPhoogleMap->MapType ="G_HYBRID_TYPE";

La cosa quedaría más o menos así (con una foto incluida).

Y bueno, algo que también me parecía bastante interesante era poder tener varias rutas en pantalla, así que me puse manos a la obra y queda igual de sencillo. Además, se le elige el color que quieres a cada trazada.

Pues bien, para ponerlo en marcha en tu web, personalizandolo a tu gusto, te lo he puesto muy fácil. Simplemente descargate estos dos ficheros:

Añade tu API KEY de google maps y ya puedes empezar a meter tus apuntes, fotos, rutas o paseos. :)

P.D.: Con un poco de imaginación es sencillo enlazarlo con una base de datos o ficheros XML para poder tener una cantidad considerable de excursiones que mostrar. Pero eso lo haré otro día, que ya es algo tarde y debería dormir un poco. ;)

11 Responses to “Mapas de Google Maps sencillos.”


  1. Avatar Xisco

    Bravo! :-)

  2. Avatar Ridik

    Magnífico, quedo a la espera de que expliques como enlazarlo con una base de datos o con ficheros XML, me interesa mucho

  3. Avatar Suki_

    La verdad es que no tengo pensado hacer nada de momento. Si me dices que es lo que necesitas, quizá pueda ayudarte a llevarlo a cabo. :)

    Si me “picas” lo suficiente con lo que quieras hacer, lo mismo hasta te lo hago. :P

  4. Avatar Unai

    Y si tenemos un servidor Windows y lo necesitamos en ASP?

    Un Saludo;

  5. Avatar Suki_

    Unai, entonces busca una solución a tu problema. Cambia la plataforma de tu servidor. Utiliza software libre. Saldras ganando en todos los aspectos. :)

  6. Avatar César

    Hola Suki,

    Estoy intentando incorporar un mapa de google en mi web y no lo consigo, he creado mi KEY_API y he pegado el codigo que da google pero me aparece un mapa de EEUU.

    ¿Me podrias echar un cable dandome algun consejo a seguir?

    GRacias de atemano.
    César

  7. Avatar Suki_

    Probablemente sea que por defecto las coordenadas que coja son las de EEUU.

    Simplemente prueba a darle las coordenadas que quieres que cargue por defecto. :)

  8. Avatar Enric Mollón

    Hola he visto que has hecho una explicación muy buena de phoogle, lo estoy intentando implementar en pruebas pero consigo saber como mostrar los mapas online, te agradecería mucho que me informaras un poquillo de que pasos tendria que seguir para hacerlo.

    Gracias de antemano!!

  9. Avatar Carlos

    Está muy bien, ¿pero tu ves los tracks en el mapa?
    http://sukiweb.net/mapa/?track=2

    Yo no los encuentro.

    Muchas gracias, y un saludo.

  10. Avatar Beatriz

    Hola, Suki
    gracias por tu informacion. He creado un google map (sin usar Phoogle) que irá integrado en mi web, pero me gustaría saber cómo puedo meter una foto en la ventana de informacion del marker. Yo sé muy poco de esto, pero he podido hacerlo todo (meter controles, definir zoom, etc) leyendo post en la web. ¿Podrías ayudarme con esas lineas de codigo que no encuentro por ningun lado? Gracias.

  11. Avatar Fernando

    David Martín , muy bueno.. realmente me sirvio muchisimo, lo que no pude hacer funcionar es el tema de los tracks y me seria de mucha utilidad.
    Te agradeceria, si me podes dar mas informacion.
    Saludos y gracias.