{"id":173,"date":"2014-11-02T09:00:57","date_gmt":"2014-11-02T08:00:57","guid":{"rendered":"https:\/\/blogs.ua.es\/idesweb\/?p=173"},"modified":"2014-10-19T19:10:15","modified_gmt":"2014-10-19T17:10:15","slug":"google-maps-insercion-de-un-mapa","status":"publish","type":"post","link":"https:\/\/blogs.ua.es\/idesweb\/2014\/11\/02\/google-maps-insercion-de-un-mapa\/","title":{"rendered":"Google Maps: inserci\u00f3n de un mapa"},"content":{"rendered":"

Un nuevo v\u00eddeo de\u00a0iDESWEB<\/a>\u00a0que se ofrecer\u00e1 a trav\u00e9s de la iniciativa\u00a0Act\u00edvate<\/a>\u00a0patrocinada por Google.<\/p>\n

[kml_flashembed movie=”http:\/\/www.youtube.com\/v\/mYDGQYB9Yno” width=”560″ height=”315″ wmode=”transparent” \/]<\/p>\n

Transcripci\u00f3n:<\/p>\n

Hola, soy Sergio Luj\u00e1n Mora, profesor de inform\u00e1tica de la Universidad de Alicante, y en este v\u00eddeo que forma parte del curso \u201cIntroducci\u00f3n al desarrollo web\u201d, te voy a explicar c\u00f3mo puedes insertar un mapa de Google Maps en una p\u00e1gina web.<\/p>\n

Muy importante, lo que te voy a mostrar a continuaci\u00f3n puede ser que s\u00f3lo funcione si la p\u00e1gina est\u00e1 publicada en Internet o en un servidor web propio. Con una p\u00e1gina local puede ser que no funcione correctamente.<\/p>\n

Insertar un mapa de Google Maps en una p\u00e1gina web es muy sencillo.<\/p>\n

En primer lugar, nos vamos a Google Maps y centramos el mapa en la parte que queremos insertar, la parte que queremos que aparezca en nuestra p\u00e1gina web. Por ejemplo, estoy centrando el mapa en la Universidad de Alicante, esto es lo que yo quiero que aparezca en mi p\u00e1gina web.<\/p>\n

A continuaci\u00f3n, me vengo aqu\u00ed al engranaje mec\u00e1nico, pulso y me aparece un men\u00fa contextual. En este men\u00fa selecciono la opci\u00f3n \u201cCompartir e insertar mapa\u201d.<\/p>\n

Tengo dos opciones para compartir el mapa. Puedo simplemente compartir un enlace al mapa o la opci\u00f3n de insertar mapa que es la que yo voy a elegir.<\/p>\n

Puedo configurar el tama\u00f1o del mapa. Puedo tener un mapa peque\u00f1o, mediano, grande o incluso podr\u00eda personalizar el tama\u00f1o del mapa. Voy a dejarlo como grande y aqu\u00ed se me proporciona el c\u00f3digo HTML que debo de copiar a mi p\u00e1gina web. Lo debo de copiar todo.<\/p>\n

Lo copio y me voy a una p\u00e1gina web sencilla, una p\u00e1gina web de ejemplo que he hecho para insertar el mapa.<\/p>\n

Esta URL que aparece aqu\u00ed lleva las coordenadas del mapa que yo quiero insertar. Lo guardo y lo ejecuto en un navegador. Y ya se carga el mapa centrado sobre la Universidad de Alicante que es la zona que yo hab\u00eda seleccionado. Y este mapa es un mapa interactivo, yo lo puedo mover, puedo hacer zoom si deseo o si quiero lo puedo ver en grande en Google Maps.<\/p>\n

Como ves es muy sencillo insertar un mapa, me voy aqu\u00ed a la rueda mec\u00e1nica y elijo la opci\u00f3n \u201cCompartir e insertar mapa\u201d y la opci\u00f3n \u201cInsertar mapa\u201d.<\/p>\n

Ya para terminar, me gustar\u00eda recordarte algunos de los sitios web en los que puedes encontrar m\u00e1s informaci\u00f3n sobre m\u00ed y sobre mi trabajo, y dos formas de contactar conmigo, a trav\u00e9s de mi correo electr\u00f3nico sergio.lujan@ua.es y a trav\u00e9s de mi cuenta en Twitter @sergiolujanmora.<\/p>\n

Recuerda que este v\u00eddeo forma parte del curso \u201cIntroducci\u00f3n al desarrollo web\u201d que est\u00e1 disponible en la direcci\u00f3n idesweb.es.<\/p>\n

Muchas gracias por tu atenci\u00f3n.<\/p>\n","protected":false},"excerpt":{"rendered":"

Un nuevo v\u00eddeo de\u00a0iDESWEB\u00a0que se ofrecer\u00e1 a trav\u00e9s de la iniciativa\u00a0Act\u00edvate\u00a0patrocinada por Google. [kml_flashembed movie=”http:\/\/www.youtube.com\/v\/mYDGQYB9Yno” width=”560″ height=”315″ wmode=”transparent” \/] Transcripci\u00f3n: Hola, soy Sergio Luj\u00e1n Mora, profesor de inform\u00e1tica de la Universidad de Alicante, y en este v\u00eddeo que forma parte del curso \u201cIntroducci\u00f3n al desarrollo web\u201d, te voy a explicar c\u00f3mo puedes insertar un mapa … <\/p>\n

Continue reading “Google Maps: inserci\u00f3n de un mapa”<\/span><\/a><\/p>\n","protected":false},"author":40,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[676],"tags":[],"class_list":["post-173","post","type-post","status-publish","format-standard","hentry","category-sin-categoria"],"_links":{"self":[{"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/posts\/173","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/users\/40"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/comments?post=173"}],"version-history":[{"count":1,"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/posts\/173\/revisions"}],"predecessor-version":[{"id":174,"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/posts\/173\/revisions\/174"}],"wp:attachment":[{"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/media?parent=173"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/categories?post=173"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.ua.es\/idesweb\/wp-json\/wp\/v2\/tags?post=173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}