He conseguido introducir el mapa que he creado anteriormente en Google Maps dentro de este blog. Para eso estoy siguiendo las instrucciones del blog de un Aussie. Sin embargo, estas instrucciones simplemente dicen cómo introducir un mapa en tu blog, pero yo voy a intentar ir más allá y voy a poner un mapa personalizado (de los MyMaps)...
Pasos a seguir:
1.- Consigue una key de uso de Google Maps aquí
2.- Edita tu plantilla de blogger e introduce el siguiente código en justo después de abrir el tag head:
3.- Crea un nuevo post y añade el siguiente código. Atención,que aquí es donde debes sustituir tus valores. Luego veremos como...
4.- sustituye el text -- your key here -- por tu key de google maps (la del punto 1)
5.-Supongo que has creado un mapa en MyMaps con tus marcadores, si no esto no tiene sentido. Ve a la página de tu mapa
6.- Encima del mapa hay un menú que dice KML. Pon el ratón encima, pulsa botón derecho y elige "Copiar ruta enlace" (Yo uso firefox, si tu usas ie es tu problema)
7.- Sustituye la url de la funcion GGeoXml con esta url que tienes en el portapapeles
8.- Vuelve al map y pulsa sobre el menú "Enlazar esta página". Aparecerá una url completa en tu navegador, copia y pégala en el notepad porque hemos de destriparla
9.- Entre los parámetros de la url busca uno llamado ll=. Esos son tu longitud y latitud. Debes ponerlos en el orden que vienen dentro del método map.setCenter(new GLatLng(X,Y),zoom);
10.- Añade el siguiente div en el sitio donde quieras poner tu mapa:
Y ya está! A algunos no entenderán ni una palabra de este post, y a mi bricomanía me parece ciencia ficción, pero tiene mucho éxito. Así que cada uno a lo suyo... Hasta luego, corazones.
ACTUALIZACIÓN (27/5):Han habido algunos cambios en la API que provocaban que no se visualizaran los tags azules! Simplemente hay que cambiar la referencia a la versión de la API (la primera línea del segundo script) a v=2.x, y todo vuelve a funcionar.
05 abril 2007
Suscribirse a:
Enviar comentarios (Atom)




24 comentarios:
Te agradesco muchisimo el post sobre este topico, justamente el Jueves empeze a hacer un mapa.
De hecho My Maps lo hace super facil de implementar y las instrucciones que pusiste fueron super importantes para poder hacer trabajar esto.
Lo de google maps es increible, utilisimo. En nuestro caso, hemos hecho un mashup que presenta los anuncios, tanto los nuevos como los que caducan, en el mapa en tiempo real: www.tablondeanuncios.com/live
Que os parece!
Ciao, ho scritto un breve tutorial in Italiano anch'io. Ho preso spunto dal tuo. Spero non ti dispiaccia. Puoi vederloo a questo indirizzo:Vigolo.info
Excelente post. Será de gran utilidad.
Saludos
Looks like there is one problem with GeoXML. The lines and the polygons created in MyMaps are not clickable, and the coments won't show up for them as they do on MyMaps.
Hi dr2ooo! lines and polygons are working in my embeded MyMap... You can click on any mark, and I've just created a polygon over the montain, and it's working too... May it be a browser problem? I use firefox 2.0
You're right! It's [style] type="text/css" v\:* { behavior:url(#default#VML); } [/style] that I've been missing. Without that it doesn't work in IE, even though it works fine in Firefox without that. Too bad the polygons and lines are not clickable as in MyMaps.
Do you have an example of the embedded map with clickable polygons?
Overall I had 2 issue:
1. IE didn't work, but I found a problem with that.
2. Polygons and Lines are still not clickable, as they are in MyMaps directly.
Thanks for the tutorial, truly useful and clear! u are great!!
Hello from Italy
Hola!
Perdona per eliminar la entrada anterior, me he equivocado antes.
He puesto el codigo que pones, y funciona mas o menos.
Sale el mapa que quiero, con las lineas y puntos de interes, pero no sale la información que hay en "my maps"
Tambien en my maps sale en vista hibrida, pero en la de mo blog sale solo calles.
Que puede ser?
Moltes gràcies!
Ignasi, lee la actualización que acabo de hacer en el post, seguramente es el problema del cambio de versión de las APIs. Prueba con eso!
Moltes gràcies per l'informació :)
Ara ja puc posar els mapes que vull!
El tema que m'ocupa ara es posar en un ifram (o embeded) els video de tv3
(va bé en firefox, pero funciona malament en explorer, que extrany!!) :(
hola man , estaba viendo tu tutorial y esta bueno pero no me salen los mensajes de las marcas en los mapas.
cual puede ser el problema?
te dejo el link para que veas, lo puse en mi blog, solo aparecen los cuadros de mensaje vacios, este es el link
www.mundocoolf.blogspot.com
Josué:
Es posible que no estés utilizando la api correcta. Mira esta línea de tu código:
<script src="http://maps.google.com/maps?file=api&v=2&key=A..." type="text/javascript"></script>
Y pureba a cambiar la versión por v=2.x
<script src="http://maps.google.com/maps?file=api&v=2.x&key=A..." type="text/javascript"></script>
ok gracias eso era,ya voy estudia la API de googlempas para personalizarlo mas todavia...
mil gracias
Saludos...
Hola, queria saber si sabes como hacer para que el mapa que salga por defecto sea el satelita, pues el area que quiero incluir no tiene mapas de calles y avenidas pero si satelital, sabras como hacerlo? Saludos
Otra solución que he encontrado que me ha sido más fácil, y que con una cuenta de google puedes hacer
1) en http://maps.google.es/ te pones en Mis Mapas
2) creas un mapa nuevo, si quieres con indicacones encima y todo
3) te vas a la pagina http://www.dr2ooo.com/tools/maps/
En el mapa de la izquierda, buscas la zona que tienes en tu mapa original, cuando la has encontrado, haces clic en set zoom y set center, te aparecerá a la derecha.
4)vas a tu google maps i donde pone KML , con el boton derecho copias la direccion del enlace, y lo pegas en la pagina de embed maps , dónde pone My Maps KML y lo pegas. Luego te saldrá encima del mapa tus anotaciones.
5) ya solo falta que pegues en tu blog o página web, lo que sale en embed maps en la parte del codigo "iframe..."
En la misma página, en inglés, ay un enlace donde viene muy bien explicado:http://www.digitalgeography.co.uk/juicy-geography/
espero que os sirva!
Juntos y revueltos Google Maps con YouTube, Panoramio y Flickr.
Los rincones más interesantes de nuestro planeta, agrupados por tipología, con sus coordenadas y un video. Obsérvalos a vista de pájaro o visualiza fotografías del lugar.
MundiVideo
Saludos a todos,
yo integro algunos mapas de Google Maps en Blogger a través de este sitio web www.mapalia.com que tiene un sistema para crear tu punto en el mapa con el texto que quieras y luego meterlo en el blog.
¿no es más facil usar el iframe que te da por defecto el enlace de página y dimensionarlo a tu antojo con width y height? el resultado es prácticamente el mismo :/
¿Estas indicaciones sirven para Wordpress?
No, para usarlo en wordpress mira esta otra entrada en mi nuevo blog de wordpress:
http://bcurtu.com/?p=195
Hola Muchas gracias por lo que pusiste, estuvo genial, me fue de mucah ayuda
Gracias, besito :D
Publicar un comentario en la entrada