Saltar al contenido principal

Tiles — incrusta un mapa base diseñado

product="tile" incrusta un mapa base diseñado de Kaleidr en un iframe mediante su ID de estilo. Tiene su propio mapa; contrólalo mediante la interfaz postMessage kaleidr-embed:*.

  • Método de integración: iframe — el mapa se carga dentro de map-embed.kaleidr.com.
  • Ámbito requerido: maps.
  • Plan mínimo: Free — una clave Free se crea con el ámbito ["maps"] y admisión del producto ["tile"]. Tile es el único producto con clave que puede ejecutar Free.

Antes de comenzar​

  • El origen de tu página debe estar en la lista de orígenes permitidos de la clave. De lo contrario, el intercambio de sesión falla con 403 session_origin_mismatch. file:// no envía ningún Origin y siempre falla — utiliza HTTP(S). Consulta Obtener una clave API.
  • Tu CSP debe permitir el cargador del SDK y el host de frame map-embed.kaleidr.com. No se necesitan hosts de imágenes de tiles/proveedores para una integración únicamente de Tile — estos se encuentran dentro del iframe de Kaleidr. Consulta Content Security Policy.

Montaje​

<kaleidr-map product="tile" publishable-key="kld_pk_live_…" style-id="kaleidr-morning"
             center="-0.12,51.5" zoom="11" style="height:480px"></kaleidr-map>

Los IDs de estilo integrados incluyen kaleidr-morning, kaleidr-afternoon, kaleidr-night, kaleidr-editorial, kaleidr-plain (y alias del registro).

Handle​

const handle = Kaleidr.mount('#basemap', {
  product: 'tile',
  publishableKey: 'kld_pk_live_…',
  styleId: 'kaleidr-night',
});

handle.setCamera({ center: [2.35, 48.85], zoom: 12 });
handle.setStyle('kaleidr-editorial');   // live style swap — tile only
handle.destroy();

setStyle(styleId) solo está disponible en el handle de tile. Llamarlo desde chat, editor o viewer registra una advertencia [kaleidr] y vuelve.

Una clave, un pool

El publishable-key (ámbito maps) autoriza el acceso al mapa base — no existe una clave de tiles independiente — y cada sesión de mapa base cuenta para la asignación mensual compartida de cargas de mapas de tu plan. Consulta Usar tiles.