Ejemplos de la Embed API
Cada ejemplo es un mapa en directo que puede usar, seguido de la página completa que lo genera. Todos controlan el mismo mapa publicado (2480 ciudades del mundo y 233 países de Natural Earth), así que puede ver todo lo que un solo mapa puede hacer desde la página que lo rodea.
| Ejemplo | Muestra |
|---|---|
| Mostrar un mapa | Montar un Icon Map publicado en una página con una sola llamada y leer lo que el mapa atenderá. |
| Volar a una ubicación | Controlar la cámara de un Icon Map insertado: volar a un lugar, encuadrar un rectángulo delimitador o una capa completa, y leer la vista. |
| Activar y desactivar capas | Crear su propio selector de capas para un Icon Map insertado a partir de las capas que informa el mapa, y mantenerlo sincronizado con el lector. |
| Filtrar con segmentaciones | Controlar las segmentaciones de un Icon Map insertado desde su propia interfaz de filtrado y mantener ambas sincronizadas, en los dos sentidos. |
| Filtrar desde su página | Aplicar filtros declarados a un Icon Map insertado desde su propia página, y ver cómo se rechaza un filtro no declarado. |
| Seleccionar y resaltar | Resaltar de forma cruzada una lista de su página con entidades de un Icon Map insertado, en los dos sentidos. |
| Marcadores, escenas y recorridos | Aplicar los marcadores del autor, capturar y restaurar sus propias vistas, copiar un vínculo a la vista actual y reproducir un recorrido en un Icon Map insertado. |
| Cambiar el estilo de la inserción | Cambiar de mapa base, ocultar los controles propios del Icon Map insertado, dibujar su propia leyenda a partir de los datos de la leyenda y exportar el mapa como imagen. |
| Comandos de la ventana emergente y eventos | Añadir una acción propia a la ventana emergente de entidad de un Icon Map insertado y observar los eventos que genera, cada uno con un motivo. |
Uso del código
Cada listado es una página HTML completa. Hasta que el SDK esté en npm, se aloja aquí: https://www.icon-map.com/js/iconmap-embed/2/iconmap-embed.umd.min.js (unos 17 KB, sin dependencias; define una única variable global, IconMapEmbed).
Para ejecutar un ejemplo con su propio mapa:
- Publique el mapa desde Icon Map y añada su sitio a sus Allowed origins.
- Sustituya
"pub_..."por su id de publicación. - Sustituya los nombres de capas, segmentaciones y campos por los de su mapa o, mejor aún, cree la interfaz a partir de
getLayers(),getSlicers()ygetFilterSchema(), como hacen varios de los ejemplos.
¿Es nuevo en la API? Empiece por Introducción.