Cuando comenzamos a registrar nuestras andadas y a subirlas a internet, junto con la descripción fotográfica de la zona, alojada en Panoramio, las APIs que ofrecía tanto Google como Panoramio no eran lo suficientemente potentes y el proceso de publicación de las mismas (mostrar las fotos) se hacía algo tedioso. De hecho, el tutorial que escribí y tengo publicado en Matando el tiempo usaba ese método. Requería paciencia por nuestra parte, y espacio, pues había que bajarse toda la codificación JASON que nos daba Panoramio y guardarla en un archivo, para la zona concreta.
Afortunadamente esta tarde me preguntaba nuestro amigo Pepe una cuestión en relación a esto, pues tenía intención de usarla en su web (os invito a que os paséis por allí, tienen rutas muy interesantes para MTB por la zona sevillana).
El caso es que me comentó que había visto una API que realizaba de forma automática las consultas a Panoramio, sin necesidad de hacerla de forma manual, es decir, carga directamente las imágenes de forma dinámica, según nos vayamos moviendo.
Seguramente llevara tiempo esta API implementada, pero yo desconocía su existencia y ahora podemos usarla sin problemas.
MENOS CUENTO CAPERUCITA
Pues bien, para mi caso particular, y que puede servir de forma genérica a otros, he retocado un poco los archivos originales, para que:
A partir de un archivo kml o kmz, podamos visualizar la zona con las fotos panoramio que por ahí existan, en un formato de mapa determinado.
CONFIGURACIÓN PARA BLOGGER
Pensemos que vamos a usarlos en blogger. Tenemos los siguientes archivos:
panoramio.js
mapas.html
El primero de ellos contiene las funciones y declaraciones que mostrarán nuestro mapa.
El segundo de los archivos contiene un ejemplo que muestra una de las rutas realizadas. La parte más importante del archivo, que es la que realmente hay que insertar en blogger sería, por un lado ésta:
Afortunadamente esta tarde me preguntaba nuestro amigo Pepe una cuestión en relación a esto, pues tenía intención de usarla en su web (os invito a que os paséis por allí, tienen rutas muy interesantes para MTB por la zona sevillana).
El caso es que me comentó que había visto una API que realizaba de forma automática las consultas a Panoramio, sin necesidad de hacerla de forma manual, es decir, carga directamente las imágenes de forma dinámica, según nos vayamos moviendo.
Seguramente llevara tiempo esta API implementada, pero yo desconocía su existencia y ahora podemos usarla sin problemas.
MENOS CUENTO CAPERUCITA
Pues bien, para mi caso particular, y que puede servir de forma genérica a otros, he retocado un poco los archivos originales, para que:
A partir de un archivo kml o kmz, podamos visualizar la zona con las fotos panoramio que por ahí existan, en un formato de mapa determinado.
CONFIGURACIÓN PARA BLOGGER
Pensemos que vamos a usarlos en blogger. Tenemos los siguientes archivos:
panoramio.js
mapas.html
El primero de ellos contiene las funciones y declaraciones que mostrarán nuestro mapa.
El segundo de los archivos contiene un ejemplo que muestra una de las rutas realizadas. La parte más importante del archivo, que es la que realmente hay que insertar en blogger sería, por un lado ésta:
<script src="http://maps.google.com/maps?file=api&v=2.x&key=nuestrakey"
type="text/javascript"></script>
<script type="text/javascript" src="http://www.google.com/jsapi?key=nuestrakey"></script>
<script src="http://www.google.com/uds/solutions/slideshow/gfslideshow.js"
type="text/javascript"></script>
<script src="http://nuestraruta/panoramio.js" type="text/javascript"></script>
Esta parte que acabamos de escribir, que debe contener nuestra API key de google, debería estar siempre cargada al acceder a nuestro blog, por eso el mejor lugar donde insertarlo es justo antes de la etiqueta </head> de nuestra plantilla del blog. Tened en cuenta que he escrito "http://nuestraruta/panoramio.js".
Por otro lado, tenemos la parte de código que escribiremos cada vez que queremos mostrar un mapa. Ese trozo es el siguiente:
Por otro lado, tenemos la parte de código que escribiremos cada vez que queremos mostrar un mapa. Ese trozo es el siguiente:
<div id="mapa1" style="width: 400px; height: 300px"></div>
<script type="text/javascript">var mapa1 = new GMap2(document.getElementById("mapa1")); setupMap(mapa1,
"http://ruta/Semillas.kml",2);</script>
y en esta línea tenemos que tener en cuenta que id, que en nuestro caso se llama mapa, tiene que coincidir con el primer parámetro de entrada a la función setupMap, pues en caso de poner dos mapas, habría que distinguirlos con diferentes nombres. El segundo parámetro es la ruta completa a nuestro archivo de ruta kml o kmz y el tercero el tipo de mapa a mostrar (1: mapa normal, 2: ortofoto, 3 o por defecto: relieve) .
El resultado sería el siguiente, para una ruta al pico Santotis:
El resultado sería el siguiente, para una ruta al pico Santotis:
No hay comentarios:
Publicar un comentario