Intégrer une carte publiée

À la fin de ce guide, une carte créée dans Kaleidr Studio est accessible sur votre propre page, limitée aux sites de votre choix, et votre page sait si elle a été chargée. Cette fonction est disponible sur tous les forfaits, y compris Free. Un compte Kaleidr est nécessaire pour publier, mais aucune clé API n’est requise.

Avant de commencer

Une carte dans Kaleidr Studio que vous souhaitez montrer au public.
Une page que vous pouvez modifier. L’élément SDK nécessite une balise <script> ; une iframe ordinaire ne demande que du HTML.
Si votre site utilise une Content Security Policy, autorisez les frames de https://map-embed.kaleidr.com et, pour l’élément SDK, les scripts de https://cdn.kaleidr.com. Voir Content Security Policy.
Un moyen de servir la page par HTTP pendant les essais, par exemple npx serve . dans son dossier.

Étape 1 : publier la carte

Ouvrez la carte dans Studio et choisissez Publish. La page Publish & embed s’ouvre.
Sous Project status, le statut est Draft. Choisissez Go Live.

Résultat attendu : le statut devient Live, le bouton devient Re-publish, un bouton Unpublish apparaît à côté et une section Embed code avec aperçu en direct s’affiche en dessous.

Une carte publiée affiche la version actuellement enregistrée dans Studio, et non une copie prise au moment du clic sur Go Live. Studio enregistre les modifications au fil du travail. Chaque modification ultérieure, même un jeu de données ajouté, est donc publique au prochain chargement de l’intégration. Il n’est pas nécessaire de choisir Re-publish : cette commande inscrit une nouvelle version publiée en conservant le même identifiant, lien et code d’intégration ; les visiteurs voient la même carte avant et après.

Pour modifier une carte publiée sans exposer le travail en cours, choisissez d’abord Unpublish, puis publiez à nouveau quand vous avez terminé, ou travaillez sur une copie distincte. La dépublication interrompt toutes les intégrations jusqu’à la prochaine publication.

La publication inclut les données importées. Les jeux de données et les superpositions d’images ajoutés dans le panneau Data sont représentés pour les visiteurs selon les couches que vous avez stylisées. Lisez Données importées sur une carte publiée avant de publier une carte contenant des données potentiellement confidentielles.

Étape 2 : copier le code d’intégration

La section Embed code propose deux formats.

Format dans Studio	Contenu	À choisir lorsque
iFrame	Une balise `<iframe>` pointant vers la carte publiée.	La page ne peut pas exécuter vos scripts (constructeur de site, bloc CMS, wiki) ou vous souhaitez simplement montrer la carte.
Developer	Le chargeur SDK et un élément `<kaleidr-map product="viewer">`.	Vous contrôlez le code et souhaitez déplacer la caméra, superposer un panneau de discussion ou gérer le cycle de vie dans une application monopage.

Choisissez un format puis cliquez sur Copy.

Format iFrame :

<iframe
  src="https://map-embed.kaleidr.com/embed/YOUR_MAP_ID"
  width="100%"
  height="480"
  style="border:0;"
  loading="lazy"
  referrerpolicy="no-referrer-when-downgrade"
  allow="geolocation; microphone; fullscreen; clipboard-write"
  title="Kaleidr map"
></iframe>

Format Developer :

<script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js" async></script>
<kaleidr-map product="viewer" share-id="YOUR_MAP_ID"
  style="display:block;width:100%;height:480px;"></kaleidr-map>

YOUR_MAP_ID représente l’identifiant inséré par Studio dans le code. Il comporte au plus 100 caractères : lettres, chiffres, ., _, ~ et -. Le même identifiant fonctionne avec les deux formats.

Les deux formats portent la Kaleidr AI de la carte : le panneau Ask Kaleidr lorsque son Control Tower est activé, et le chat IA dans ses popups lorsque Popup Window est activé. Voir Kaleidr AI sur une carte publiée.

Étape 3 : ajouter le code à la page et régler la taille

Collez le code à l’emplacement où la carte doit apparaître.

Résultat attendu : le message « Loading map… » apparaît, puis la carte s’affiche dans la vue enregistrée dans Studio.

Règles de dimensionnement :

Iframe ordinaire : définissez width et height sur l’iframe comme sur toute autre iframe.
Élément SDK : donnez une hauteur à l’élément. <kaleidr-map> utilise display:block par défaut, donc la hauteur s’applique. Les exemples définissent néanmoins style="display:block; height:480px", ce qui couvre Safari antérieur à 16.4, où l’élément reste en ligne et ignore height. Une feuille de style peut aussi définir les dimensions.
```
kaleidr-map { display: block; height: 480px; }
```
La carte occupe toute la largeur de l’élément. Si celui-ci n’a aucune hauteur au montage, elle adopte 500 pixels de hauteur fixe, même si vous la modifiez ensuite. Un élément dans un onglet caché ou un panneau replié n’a pas forcément de hauteur : montez-le lorsqu’il devient visible ou définissez-en une explicitement.
Toute propriété CSS donnant une hauteur calculable convient pour une mise en page adaptable : height:60vh, aspect-ratio:16/9, ou une cellule flex/grid.

Étape 4 : définir la caméra initiale (facultatif)

La carte s’ouvre dans la vue enregistrée par son auteur. Celui-ci peut avoir défini des vues distinctes pour les écrans d’ordinateur, de tablette et de téléphone, ou demandé le cadrage automatique du contenu. Dans ce dernier cas, la vue dépend de la largeur du cadre et s’ajuste de nouveau lors d’un redimensionnement. Pour ouvrir ailleurs, fournissez une caméra. center utilise l’ordre longitude puis latitude.

Sur l’élément :

<kaleidr-map product="viewer" share-id="YOUR_MAP_ID"
             center="-0.1276,51.5072" zoom="12" pitch="45" bearing="-20"
             style="display:block; height:480px"></kaleidr-map>

Dans une iframe ordinaire, ajoutez camera=longitude,latitude,zoom à l’URL :

<iframe
  src="https://map-embed.kaleidr.com/embed/YOUR_MAP_ID?camera=-0.1276,51.5072,12&pitch=45&bearing=-20"
  width="100%" height="480" style="border:0;" loading="lazy"
  referrerpolicy="no-referrer-when-downgrade" allow="geolocation; microphone; fullscreen; clipboard-write"
  title="Kaleidr map"></iframe>

La caméra fournie l’emporte sur la vue enregistrée par l’auteur, y compris les variantes pour différentes largeurs et le cadrage automatique. Chaque valeur remplace uniquement le champ correspondant ; les autres conservent les valeurs de l’auteur. Dès qu’une caméra est fournie par votre page, le cadrage automatique au redimensionnement s’arrête. Retenez que zoom est ignoré si center n’est pas également fourni. pitch et bearing fonctionnent séparément.

Résultat attendu : la carte s’ouvre avec la caméra choisie, tout en conservant ses repères, couches et données importées.

Pour déplacer la caméra après le chargement, montez la carte en JavaScript et conservez le handle renvoyé :

<div id="map" style="height:480px"></div>
<button id="paris">Paris</button>

<script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js"></script>
<script>
  const handle = Kaleidr.mount('#map', {
    product: 'viewer',
    shareId: 'YOUR_MAP_ID',
  });

  document.getElementById('paris').addEventListener('click', () => {
    // duration is in milliseconds. Leave it out to jump with no animation.
    handle.setCamera({ center: [2.3522, 48.8566], zoom: 12, duration: 800 });
  });
</script>

Deux points à connaître sur setCamera :

La méthode appartient au handle renvoyé par Kaleidr.mount, pas à l’élément. document.querySelector('kaleidr-map').setCamera vaut undefined. Pour déplacer une carte montée par un élément, modifiez ses attributs center, zoom, pitch ou bearing : la nouvelle vue apparaît immédiatement, sans animation.
Elle peut être appelée dès que Kaleidr.mount renvoie un résultat. Si la carte de l’iframe n’est pas encore prête, l’appel est conservé puis exécuté à la réception du signal de disponibilité ; nul besoin d’attendre le message kaleidr-embed:ready de l’étape 6. Définissez la vue initiale dans les options de montage.
Comme une caméra passée au chargement, cet appel remplace la vue de l’auteur et met fin au recadrage automatique après redimensionnement. Les champs omis conservent leur valeur actuelle.

Étape 5 : limiter les sites autorisés à afficher la carte (facultatif)

Par défaut, tout site connaissant l’identifiant d’une carte publiée peut l’afficher. Pour le limiter :

Dans Studio, ouvrez la carte et choisissez Share. L’ouverture du dialogue publie la carte si nécessaire et crée à chaque fois un nouveau lien de partage.
Ouvrez l’onglet Embed.
Remplacez Any domain par Specific domains dans la liste déroulante.
Saisissez un domaine par ligne, par exemple :
```
example.com
blog.example.org
```
Cliquez à l’extérieur du champ. Studio enregistre la liste et affiche Saved.

Résultat attendu : la carte reste visible sur les sites de la liste. Les autres sites affichent « This map isn’t allowed to render on this site. Please contact the map owner. » dans le cadre.

Règles de correspondance :

Saisissez uniquement les noms d’hôtes. Le préfixe https:// est ignoré. N’ajoutez ni chemin ni port.
Un domaine couvre ses sous-domaines. example.com autorise example.com, www.example.com et shop.eu.example.com.
Pour effectuer des tests locaux avec cette restriction, ajoutez localhost.

Le contrôle dépend du référent

La carte vérifie si votre site est autorisé grâce au référent envoyé par le navigateur au chargement de l’iframe. Si aucun référent n’est transmis, une carte limitée à certains domaines ne peut pas apparaître. Cela arrive lorsque :

votre page utilise Referrer-Policy: no-referrer ou same-origin dans l’en-tête HTTP ou dans <meta name="referrer"> ;
l’iframe porte referrerpolicy="no-referrer" ;
la page est ouverte depuis un fichier local file:// ;
l’adresse de l’iframe est ouverte directement dans un onglet du navigateur.

La politique habituelle des navigateurs, strict-origin-when-cross-origin, transmet l’origine et fonctionne. Si votre site utilise une politique plus stricte, conservez le referrerpolicy="no-referrer-when-downgrade" du code iframe, ou assouplissez la politique de la page hôte.

Si la carte est affichée dans une frame elle-même intégrée, son référent sera l’adresse de cette frame ; c’est donc son domaine qui doit figurer dans la liste.

Les domaines autorisés contrôlent où la carte peut s’afficher. Ils ne protègent pas la confidentialité d’une carte publiée, y compris les jeux de données qu’elle dessine : voir Données importées sur une carte publiée. Ne publiez pas de données qui doivent rester privées.

Étape 6 : détecter le chargement ou l’échec (facultatif)

Le SDK ne fournit pas de promesse ready et l’élément ne déclenche aucun événement. L’iframe signale à la page deux situations en lui envoyant un message :

Message	Quand	Champs
`kaleidr-embed:ready`	La carte a été dessinée une première fois.	`type`, `id` (identifiant de carte), `source` (`"publish"` ou `"share"`)
`kaleidr-embed:error`	La carte n’a pas pu charger ou une partie n’a pas pu être dessinée.	`type`, `id`, `code`, `message`

Écoutez les messages sur window et vérifiez leur origine ainsi que la frame émettrice :

const el = document.getElementById('locations'); // the <kaleidr-map> element

window.addEventListener('message', (event) => {
  if (event.origin !== 'https://map-embed.kaleidr.com') return;
  const frame = el.querySelector('iframe');
  if (!frame || event.source !== frame.contentWindow) return;

  const msg = event.data;
  if (!msg || typeof msg.type !== 'string') return;

  if (msg.type === 'kaleidr-embed:ready') {
    console.log('map loaded', msg.id);
  } else if (msg.type === 'kaleidr-embed:error') {
    console.warn('map problem', msg.code, msg.message);
  }
});

Pour une iframe ordinaire, comparez event.source à son contentWindow.

Le champ code d’un message d’erreur peut avoir l’une des valeurs suivantes :

`code`	Signification	Message visible dans le cadre
`no_id`	L’URL de l’iframe ne contient pas d’identifiant de carte.	« Couldn't find a map id in the URL. »
`not_found`	Aucune carte publiée ne porte cet identifiant : jamais publiée, dépubliée ou identifiant erroné.	« This map isn't available — it may have been unpublished, paused, or the link is incorrect. »
`domain_not_allowed`	Le domaine n’est pas autorisé ou aucun référent n’a été envoyé.	« This map isn't allowed to render on this site. Please contact the map owner. »
`map_loads_exhausted`	L’organisation a épuisé son quota de chargements de cartes pour la période.	« This map has reached its map load limit. It will be available again when the owner's allowance resets. »
`fetch_failed`	Impossible de récupérer la carte, par exemple à cause du réseau.	« Could not load the map. Please try again in a moment. »
`maplibre_error`	La carte a démarré mais une partie n’a pas pu être dessinée ; `message` contient les détails.	La carte peut être visible, avec des éléments manquants.

Précisions sur les délais :

Pour tout code autre que maplibre_error, aucune carte ne s’affiche et ready n’arrive jamais.
maplibre_error peut arriver avant ou après ready, parfois plusieurs fois. Traitez-le comme un avertissement, pas comme la preuve d’une carte inutilisable.
L’iframe SDK est chargée de manière différée : une carte située bien en dessous de la partie visible ne démarre que lorsque le visiteur s’en approche en faisant défiler la page. Quelques secondes de silence ne signifient donc pas un échec.
Le cadre émet d’autres messages kaleidr-embed: pour son fonctionnement interne. Ils ne font pas partie de l’API publique. Ignorez tout sauf les deux types décrits ci-dessus.

Page complète

Enregistrez sous index.html, remplacez YOUR_MAP_ID et servez le dossier par HTTP.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Our locations</title>
  <style>
    body { font-family: system-ui, sans-serif; margin: 2rem; }
    #map { height: 480px; }
  </style>
</head>
<body>
  <h1>Our locations</h1>
  <p id="status">Loading the map…</p>

  <div id="map"></div>
  <p>
    <button id="london">London</button>
    <button id="paris">Paris</button>
  </p>

  <script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js"></script>
  <script>
    const target = document.getElementById('map');
    const status = document.getElementById('status');

    const handle = Kaleidr.mount(target, {
      product: 'viewer',
      shareId: 'YOUR_MAP_ID',
    });

    window.addEventListener('message', (event) => {
      if (event.origin !== 'https://map-embed.kaleidr.com') return;
      const frame = target.querySelector('iframe');
      if (!frame || event.source !== frame.contentWindow) return;
      const msg = event.data;
      if (!msg || typeof msg.type !== 'string') return;

      if (msg.type === 'kaleidr-embed:ready') {
        status.textContent = 'Map loaded.';
      } else if (msg.type === 'kaleidr-embed:error' && msg.code !== 'maplibre_error') {
        status.textContent = 'The map could not load (' + msg.code + ').';
      }
    });

    document.getElementById('london').addEventListener('click', () => {
      handle.setCamera({ center: [-0.1276, 51.5072], zoom: 12, duration: 800 });
    });
    document.getElementById('paris').addEventListener('click', () => {
      handle.setCamera({ center: [2.3522, 48.8566], zoom: 12, duration: 800 });
    });
  </script>
</body>
</html>

Comportement

Sujet	Comportement
Vue initiale	Celle enregistrée par l’auteur, sauf si vous fournissez une caméra. Les paramètres fournis remplacent la vue champ par champ.
Défilement	Faire défiler avec le pointeur sur la carte zoome la carte, comme dans Studio. Avec le pointeur hors de la carte, le défilement déplace la page. Sur écran tactile, faire glisser le doigt déplace la carte et pincer la zoome.
Actualisations	L’intégration montre l’état actuellement enregistré dans Studio ; une modification apparaît au chargement suivant, sans nouvelle publication.
Données importées	Les jeux de données et images superposées de Studio sont affichés selon les couches stylisées. Voir Données importées.
Dépublication	Les intégrations affichent un message d’indisponibilité. Republier rétablit les mêmes URL ; voir Dépublication.
Popups	Le clic ouvre une fiche de lieu uniquement si l’auteur a activé les popups.
Hauteur	Suit la hauteur de l’élément au montage ou utilise 500 pixels fixes.
Chargement	L’iframe SDK charge différé à l’approche de la zone visible.
Clé	Aucune. Ne fournissez pas de clé publiable à Viewer : elle déclencherait une session inutile et, en cas de refus, la carte ne s’afficherait pas.

Données importées sur une carte publiée

Les jeux de données ajoutés dans le panneau Data de Studio font partie de la carte publiée. Les visiteurs voient chaque jeu sous la forme de la couche que vous avez stylisée, ainsi que les images superposées à leur emplacement. Le comportement est identique pour une iframe ordinaire, l’élément SDK et un lien de partage. Rien n’est à activer, et la page hôte n’a pas besoin de clé.

Puisqu’une carte publiée montre son état enregistré actuel, tout jeu de données ajouté après publication devient public dès son enregistrement, sans nouvelle publication.

Données servies et destinataires :

Uniquement les données d’une carte publiée. Un jeu de données est transmis à un visiteur seulement dans le cadre d’une carte publiée ou d’un lien de partage, et si cette carte le contient. Les jeux d’une carte non publiée ne sont pas servis.
Un jeu de données ne peut pas être récupéré seul. Rien ne répertorie tous les jeux de données d’une carte et son identifiant n’ouvre rien sans la carte publiée correspondante.
Toute personne pouvant ouvrir la carte peut lire les données. Une carte publiée est publique. Les restrictions de domaine contrôlent l’affichage, pas la confidentialité.
Toutes les colonnes sont transmises, pas seulement celles utilisées pour le style. Le navigateur reçoit chaque ligne et toutes ses colonnes. Supprimez les colonnes confidentielles avant de publier, puis importez à nouveau le fichier.

Comment arrêter de servir un jeu de données :

Action dans Studio	Effet sur la carte publiée	Effet sur un lien de partage
Supprimer le jeu de données dans le panneau Data	Les données ne sont plus servies ; le reste de la carte ne change pas.	Le lien montre la carte sans la couche correspondante.
Dépublier la carte	Aucune partie de la carte, jeux de données inclus, n’est servie.	Aucun effet : les liens de partage déjà créés restent actifs avec leurs données.

Pour supprimer un jeu de données, cliquez sur la corbeille de sa ligne dans le panneau Données et confirmez. Supprimer ou remplacer un jeu de données explique les étapes et l'effet d'Annuler ensuite. La suppression des seules couches qui affichent le jeu de données ne suffit pas : celui-ci reste stocké et associé à la carte, donc continue d'être servi.

Un lien de partage est un instantané de la conception de la carte. Il affiche la carte telle qu'elle était au moment de sa création : toute modification ultérieure ou dépublication de la carte ne change pas son contenu. L'instantané conserve également le nom de la carte, la liste des domaines autorisés et les interrupteurs Kaleidr AI de cette date ; une modification ultérieure de ces éléments ne change ni l'endroit où un lien déjà créé s'affiche, ni les fonctions Kaleidr AI qu'il propose. Sa Kaleidr AI dépend aussi de la carte : elle ne fonctionne que tant que la carte est publiée, et seulement sur une page que les domaines autorisés de la carte incluent actuellement ; dépublier la carte ou retirer un domaine l'arrête donc. Le propriétaire de la carte la paie ; voir Kaleidr AI sur une carte publiée.

Un lien de partage est un instantané du design de la carte. Il montre la carte telle qu’elle était à la création du lien : les modifications ultérieures et sa dépublication ne le changent pas. Les jeux de données font exception : le lien lit la même copie stockée que la carte. Supprimer un jeu de données le retire donc de tous les liens qui l’affichaient.

L’ouverture du dialogue Share dans Studio publie la carte et crée un nouveau lien à chaque fois. Une carte partagée plusieurs fois possède donc plusieurs liens, chacun représentant un instantané du design à un moment différent.

Studio ne propose aucun bouton pour supprimer ou suspendre un lien de partage. Il reste actif tant que les données affichées ne sont pas supprimées ou que Kaleidr ne retire pas le lien à votre demande. Pour partager un état plus récent, ouvrez de nouveau Share et utilisez le nouveau lien ; les anciens gardent leur contenu.

Dépublier une carte

Sur la page Publish & embed, une carte active propose Unpublish à côté de Re-publish. Studio demande : « Unpublish this map? Embeds of it stop working. Share links you have already handed out still show the map, but their Kaleidr AI stops. » Choisissez Unpublish pour confirmer ou Cancel pour annuler.

Toutes les intégrations de la carte s’arrêtent : le cadre affiche l’indisponibilité et envoie not_found.
La carte conserve son identifiant. En choisissant de nouveau Go Live, les mêmes URL d’intégration recommencent à fonctionner sans modifier vos pages.
Les liens déjà distribués continuent de fonctionner avec leurs données. Leur Kaleidr AI s'arrête jusqu'à ce que vous republiiez la carte.

L’arrêt ne prend pas effet immédiatement partout :

Un navigateur ayant déjà chargé les données les conserve. Le visiteur qui regarde encore la carte voit sa couche et son navigateur peut réutiliser des données en cache pendant quelques minutes.
Un lien de téléchargement déjà émis peut rester utilisable jusqu’à une heure. Pour les grands jeux de données, le navigateur reçoit une URL temporaire valable jusqu’à expiration, au maximum une heure après son émission, même si le jeu est supprimé ou la carte dépubliée.

Fonctionnement du chargement :

Chaque visiteur télécharge tout le jeu de données. Les données ne sont pas chargées par morceaux pendant que le visiteur déplace la carte. Beaucoup de lignes ou de colonnes ralentissent donc l’affichage, surtout avec une connexion lente. Ne publiez que les données utiles.
L’échec du chargement d’un jeu de données ne fait pas échouer toute la carte. Le reste s’affiche sans cette couche.

Les quantités autorisées sont précisées dans Limites des jeux de données.

Calcul des vues

Chaque chargement de l’intégration par un visiteur compte une vue dans le quota de l’organisation propriétaire de la carte, pas de celle qui l’intègre. Un même visiteur chargeant la même carte plusieurs fois dans les 24 heures ne compte qu’une fois. Les vues sur les pages Kaleidr, par exemple dans l’aperçu Studio, ne comptent pas.

Quand l’organisation a épuisé ses chargements de cartes pour la période, l’intégration affiche la limite atteinte et envoie map_loads_exhausted jusqu’au renouvellement du quota. Voir Quotas et limites de débit.

Vérifier le fonctionnement

Dans la page : la carte présente vos repères, itinéraires, jeux de données et images superposées provenant de Studio avec les styles appliqués. Les boutons de zoom fonctionnent et les crédits sont visibles en bas.
Dans la console : aucune ligne contenant [kaleidr.
Dans l’onglet Réseau : une requête document vers https://map-embed.kaleidr.com/embed/YOUR_MAP_ID avec statut 200. Avec l’élément SDK, kaleidr.js et viewer.js viennent aussi de https://cdn.kaleidr.com.
Dans l’écouteur : un message kaleidr-embed:ready.

En cas de problème

Symptôme	Cause	Solution
La carte mesure toujours 500 pixels, quel que soit `height`.	L’élément n’avait aucune hauteur au montage, CSS a défini `display:inline`, ou Safari avant 16.4 n’a pas `display:block`.	Définissez `display:block` et une hauteur, et montez l’élément lorsqu’il est visible.
Rien ne s’affiche. Console : `[kaleidr] <kaleidr-map> requires product="chat\|viewer\|editor\|tile"`	L’attribut `product` manque ou est mal orthographié.	Définissez `product="viewer"`.
Console : `[kaleidr:viewer] Kaleidr map: invalid id "" — must match ^[A-Za-z0-9._~-]{1,100}$.`	`share-id` est vide, absent ou contient un caractère invalide.	Recopiez l’identifiant depuis Studio.
Console : `[kaleidr:viewer] mount target not found: #map`	`Kaleidr.mount` a été lancé avant la création de la cible ou le sélecteur est incorrect.	Déplacez le script après l’élément ou corrigez le sélecteur.
Console : `Kaleidr is not defined`	Le code a démarré avant le chargement de `kaleidr.js` ; le code Studio utilise `async`.	Supprimez `async` ou déclenchez votre code à l’événement `load`.
Le cadre indique « This map isn't available… ».	Carte non publiée, dépubliée ou mauvais identifiant.	Cliquez sur Go Live dans Studio ; le même ID est conservé si elle a déjà été publiée.
Le cadre indique « This map isn't allowed to render on this site. »	Domaine non autorisé ou référent absent.	Ajoutez le domaine dans Studio ou corrigez la politique de référent. Voir étape 5.
Le cadre indique « This map has reached its map load limit. »	Quota de chargements épuisé.	Attendez le renouvellement ou augmentez le quota ; voir Quotas.
Le cadre indique « Could not load the map. Please try again in a moment. »	Échec de récupération de la carte.	Rechargez puis vérifiez le réseau et l’URL iframe si le problème persiste.
Cadre vide et violation CSP pour `frame-src`.	La politique bloque la frame.	Autorisez `https://map-embed.kaleidr.com` dans `frame-src`.
Violation CSP pour `script-src`.	La politique bloque le chargeur SDK.	Autorisez `https://cdn.kaleidr.com` dans `script-src` ou utilisez l’iframe ordinaire.
`setCamera` n’a aucun effet.	La carte n’a pas fini de charger ou le handle est détruit.	Consultez `kaleidr-embed:error` et la console ; les commandes précoces s’exécutent une fois la carte prête. Si la carte n’a pas signalé son chargement au terme d’une attente limitée, normalement 10 secondes après le chargement de l’iframe, l’appel est néanmoins envoyé et la console indique `[kaleidr] the map frame has not reported ready` : une iframe en erreur n’a pas de carte à déplacer ou modifier.
`el.setCamera is not a function`	La méthode a été appelée sur l’élément.	Utilisez le handle de `Kaleidr.mount` ou modifiez les attributs caméra. `setCamera`
Le défilement de la page s’arrête sur la carte.	Comportement prévu : avec le pointeur sur la carte, le défilement zoome la carte.	Faites défiler avec le pointeur à côté de la carte. Donnez à la carte une hauteur inférieure à celle de l’écran, pour que les visiteurs puissent la dépasser en défilant.
Les modifications ne s’affichent pas dans l’intégration.	Celle-ci a chargé l’état enregistré avant la modification.	Rechargez la page hôte ; il n’est pas nécessaire de republier.
Une modification non voulue apparaît publiquement.	La carte publiée affiche le dernier état enregistré.	Annulez la modification ou travaillez après dépublication ou dans une copie. Référence
Une couche de données importées manque.	Le jeu a été supprimé ou son chargement a échoué, sans bloquer le reste.	Vérifiez le jeu et sa couche dans Studio, puis rechargez.
La couche d’un grand jeu apparaît tardivement.	Tout le jeu est téléchargé par chaque visiteur.	Réduisez les lignes ou colonnes ; voir Données importées.

Limites

L’intégration est en lecture seule. Votre page ne peut ni ajouter des repères ou couches, ni lire les données ni recevoir les clics.
Les seuls signaux sont kaleidr-embed:ready et kaleidr-embed:error.
Vous ne pouvez pas modifier le style ni remplacer le fond de carte depuis l’intégration. Faites-le dans Studio : la modification apparaît au chargement suivant.
Modifier share-id après le montage n’a aucun effet. Retirez puis recréez l’élément, ou appelez handle.destroy() et remontez-le.
Les domaines autorisés dépendent du référent du navigateur et ne constituent pas une information secrète.

Étapes suivantes

Référence Viewer : toutes les options, attributs et messages.
Kaleidr AI sur une carte publiée : permettre aux visiteurs de poser des questions.
Jeux de données cartographiques : fichiers, limites et rôles des colonnes.
Intégration aux frameworks : montage et destruction avec React, Next.js et Vue.
Content Security Policy : paramètres de sécurité.

Avant de commencer​

Étape 1 : publier la carte​

Étape 2 : copier le code d’intégration​

Étape 3 : ajouter le code à la page et régler la taille​

Étape 4 : définir la caméra initiale (facultatif)​

Étape 5 : limiter les sites autorisés à afficher la carte (facultatif)​

Étape 6 : détecter le chargement ou l’échec (facultatif)​

Page complète​

Comportement​

Données importées sur une carte publiée​

Liens de partage​

Dépublier une carte​

Calcul des vues​

Vérifier le fonctionnement​

En cas de problème​

Limites​

Étapes suivantes​