Skip to main content

Tiles — embed a designed basemap

product="tile" embeds a Kaleidr designed basemap in an iframe, by style id. It owns its own map; drive it over the kaleidr-embed:* postMessage seam.

<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>

Built-in style ids include kaleidr-morning, kaleidr-afternoon, kaleidr-night, kaleidr-editorial, kaleidr-plain (and registry aliases).

Imperative style swap:

const handle = Kaleidr.mount('#basemap', {
product: 'tile', publishableKey: 'kld_pk_live_…', styleId: 'kaleidr-night',
});
handle.setCamera({ center: [2.35, 48.85], zoom: 12 });
One key, one pool

The publishable-key (maps scope) authorizes basemap access — there is no separate tile key — and every basemap session counts toward your plan's shared monthly map-loads allowance. See Use tiles.