Embeber o incrustar Google maps

Escrito por eco escuela 2.0 el . Posteado en Embeber contenido, Gestión de contenidos en el Blog, Tutoriales y ayudas

El código que nos proporciona google maps ya no nos sirve para incrustar el mapa con la localización de nuestro centro en un post o una página. El problema radica que este código nos lo proporciona Google con una etiqueta HTML tipo <iframe>. Los iframes no se pueden usar en «Blogs de los centros» por razones de seguridad. Si quiere conocer cuales son los motivos, lee esta entrada: Código embebido limitado en blogs de los centros.

Localiza tu centro en google maps

Localiza tu centro con google maps

El equipo de soporte de «Blog de los centros» ha habilitado un plugin que permite añadir un mapa de google en una entrada y/o página con códigos cortos. Los siguientes ejemplos muestran todos los parámetros disponibles que puede utilizar en su código corto. Tenga en cuenta que estos ejemplos tienen que escribirse en una sóla línea, sin hipervínculos y sin estilos (aquí le damos formato negrita para resaltar los parámetros que podemos utilizar, pero usted debe obviar esto y ponerlo en formato normal o regular). Estos estilos deben ser retirados durante la ejecución real.

Características

  • Soporte para Google MyMaps.
  • Ventanas de Información.
  • Varios mapas en el mismo puesto.
  • Establecer el tamaño del mapa.
  • Establecer el nivel de zoom.
  • Establecer el tipo de mapa.
  • Ubicación definida por la latitud y longitud.
  • Ubicación establecida por la dirección.
  • Añadir marcador.
  • Agregar la imagen como icono de mapa personalizado.
  • Añadir KML través de un enlace URL.
  • Mostrar el tráfico.

Mapa del mundo predeterminado 

 

[map]

[map]

Múltiples mapas en la misma página

Para añadir más de un mapa a la misma página, es necesario agregar un parámetro «id» para el nuevo mapa. Desde el predeterminado para el primer mapa es «map», asegúrate de renombralo diferente (por ejemplo: «map1», «map2»). Todos los atributos «id» de identificación en la misma página deben ser únicos.

[map id="map2"]

[map id=»map2″]

Anchura y altura

Valor por defecto ancho = 400, valor por defecto de altura = 300 (en píxeles)

[map id="map3" w="200" h="100"]

[map id=»map3″ w=»200″ h=»100″]

Nivel de zoom

Valor por defecto = 1

[map id="map4" z="4"]

[map id=»map4″ z=»4″]

Latitud / Longitud

Valor por defecto = 0,0. En el ejemplo, ubicación del CEIP Rodríguez Galván.

[map id="map5" z="15" lat="28.47335" lon="-16.272613"]

[map id=»map5″ z=»15″ lat=»28.47335″ lon=»-16.272613″]

Los datos de la latitud y longitud exacta los obtenemos del código que nos proporciona Google Maps en la opción de «Enlazar» que apreciamos remarcada en rojo en el siguiente gráfico:

google-maps-ceip-rodriguez-galvan

Obtener latitud y longitud en Google Maps

Tipo de Mapa

Valor por defecto = valores aceptados
MAPTYPE = TERRAIN | SATELLITE| HYBRID | TERRENO

[map id="map6" lat="28.47335" lon="-16.272613" z="15" maptype="SATELLITE"]

[map id=»map6″ lat=»28.47335″ lon=»-16.272613″ z=»15″ maptype=»SATELLITE»]

Dirección

Si usted proporciona una dirección, esta prevalecerá sobre cualquier parametro «lat»/»lon» (latitud/longitud).

[map id="map7" z="15" address="Tinajo, Canary islands"]

[map id=»map7″ z=»15″ address=»Tinajo, Canary islands»]

Marcador

[map id="map8" z="15" address="Galdar, Canary islands" marker="yes"]

[map id=»map8″ z=»15″ address=»Galdar, Canary islands» marker=»yes»]

Marcador de la imagen

Usted puede agregar su propia imagen personalizada para reemplazar el icono predeterminado en el mapa de Google. Asegúrese de que su imagen sea pequeña. Además, le recomendamos que utilice una imagen con formato de archivo .gif o .png con transparencia. Si usted utiliza su propia imagen, asegúrese de agregar también el parámetro marker=»yes».

[map id="map9" z="15" address="la oliva, Canary islands" marker="yes" markerimage="http://code.google.com/apis/maps/documentation/javascript/ examples/images/beachflag.png"]

[map id=»map9″ z=»15″ address=»la oliva, Canary islands» marker=»yes» markerimage=»http://code.google.com/apis/maps/documentation/javascript/examples/images/beachflag.png»]

Ventana de información

Si ha ajustado marker=»yes» , entonces también puede optar por proporcionar una burbuja de ventana de información. También se permite insertar, en esta información,  eiquetas HTML simples.

NOTA: La ventana de Información es muy meticulosa en cuanto a la sintaxis. Trate de usar <span> etiquetas en lugar de <div>, y tratar de evitar comillas dobles.

[map id="map10" z="15" address="La Orotava" marker="yes"
infowindow="<strong>La Orotava</strong><br>Es un municipio español
perteneciente a la provincia de Santa Cruz de Tenerife (Canarias)."]

[map id=»map10″ z=»15″ address=»La Orotava» marker=»yes» infowindow=»La Orotava. Es un municipio español perteneciente a la provincia de Santa Cruz de Tenerife (Canarias). Está situado en el norte de la isla de Tenerife. Ocupa buena parte del Valle de La Orotava, en las faldas del Teide. En este valle también se encuentran los municipios del Puerto de la Cruz y de Los Realejos.»]

KML

Agregar una dirección URL KML anulará cualquier parámetro «address» o o «lat»/»lon». El auto-centrado y el zoom se realizará en función de la extensión de la KML, por lo tanto, anula cualquier configuración del nivel de zoom.

[map id="map11" z="5" kml="http://gmaps-samples.googlecode.com/ svn/trunk/ggeoxml/cta.kml" ]

[map id=»map11″ z=»5″ kml=»http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml» ]

Tráfico

[map id="map12" z="10" address="Los Angeles, USA" traffic="yes" ]

[map id=»map12″ z=»10″ address=»Los Angeles, USA» traffic=»yes» ]

Etiquetas:, , , , ,

"Trackback" Enlace desde tu web.

eco escuela 2.0

eco escuela 2.0 es un entorno de trabajo cooperativo y colaborativo que reconduce los procesos tradicionales de profesorado de "Enseñar" y de "Aprender" del alumnado a un nuevo modelo en el que cambia el rol del Profesorado "enseña" y del alumnado (aprende o memoriza) a otro en el que se reinventan y RECREAN los procesos de enseñar y aprender en el que ambos APRENDEN A APRENDER.

Deja un comentario