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 });
Public-basemap-first

The base basemap is served from the public tile CDN, so it renders today. The api-key (maps scope) is carried for usage attribution as metered tiles roll out — there is no separate tile key. See Use tiles.