Aller au contenu principal

Ajouter l’éditeur de cartes

Montez l’éditeur Kaleidr dans votre page et permettez aux utilisateurs de concevoir une carte.

Nécessite une clé publishable avec le scope design sur un forfait Pro ou supérieur. L’ origin de votre page doit figurer dans l’allowlist de la clé et être servi en HTTP(S) ; votre CSP doit autoriser 'wasm-unsafe-eval' (MapLibre) ainsi que les hôtes tile/vendor — consultez Obtenir une clé API et Content Security Policy.

<div id="editor" style="height:640px"></div>
<script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js"></script>
<script>
const handle = Kaleidr.mount('#editor', {
product: 'editor',
publishableKey: 'kld_pk_live_…', // design scope
styleId: 'kaleidr-night', // catalog basemap id or full style URL
center: [-0.12, 51.5],
zoom: 11,
pitch: 35,
bearing: -15,
});
// later: handle.destroy();
</script>

L’éditeur crée sa propre carte MapLibre dans #editor. Ses assistants map-design (analyser un dataset, créer une layer) appellent la surface design de la plateforme avec votre clé, ce qui facture le scope design. Passez styleId (un catalog basemap id tel que kaleidr-night, ou une full style URL) pour commencer à partir d’un basemap.

Pour un dev basemap, passez tileBase: 'https://tile-dev.kaleidr.com' — les style ids du catalogue seront alors résolus par rapport à celui-ci plutôt qu’au système de production tile.kaleidr.com.

Consultez Editor attach.