passerelle-geo-components 0.2.0-alpha.1

package/README.md

@@ -0,0 +1,77 @@
+# passerelle-geo-components
+
+**Web Components pour cartes MapLibre + composants controllers pilotes — brique commune multi-projet.**
+
+Zero dependance runtime (peer `maplibre-gl@^5.6.1`, `geoai-kit@^0.2.0` optionnel), ES module, executable dans un navigateur — widget SPA, PWA, page HTML statique, iframe SSR, storymap.
+
+> **Statut** : `0.2.0-alpha.1` (developpement). API stable prevue en `0.2.0` a l'issue du Sprint V0.2.
+
+---
+
+## Installation
+
+```bash
+npm install passerelle-geo-components
+```
+
+Peer runtime :
+
+```bash
+npm install maplibre-gl
+```
+
+## Usage
+
+Import direct dans le HTML ou via bundler :
+
+```html
+<script type="module" src="node_modules/passerelle-geo-components/geo-components.js"></script>
+
+<geo-map params='{"basemap":"osm","bbox":[5.3,43.28,5.42,43.34]}'></geo-map>
+```
+
+Ou via bundler :
+
+```js
+import "passerelle-geo-components";
+```
+
+## Composants exposes
+
+- `<geo-map>` — carte MapLibre pilotee par attribut `params` (SceneManifest V0.3.1)
+- `<geo-timeline>` — controller temporel `input[type=range]` liee par `target`
+- `<geo-legend>` — legende declarative (mode auto ou items explicites)
+- `<geo-3d-scene>` — slot composition Three.js chargee a la demande (opt-in 3D)
+
+Voir la source `geo-components.js` pour l'API complete des attributs.
+
+## Contract SceneManifest V0.3.1
+
+Le composant `<geo-map>` accepte un `params` conforme au JSON Schema `scene_manifest.schema.json` livre dans ce package :
+
+```js
+import schema from "passerelle-geo-components/schemas/scene-manifest";
+```
+
+Ou en TypeScript :
+
+```ts
+import { SceneManifestSchema } from "passerelle-geo-components/schemas/scene-manifest-zod";
+```
+
+9 exemples canoniques disponibles dans `examples/` — minimal, diagnostic-temporel, corpus-documentaire, choropleth-demographique, heatmap-rag, timeline-overlay-simple, multi-layers-narrative, maquette-3d, validation-terrain.
+
+## Peer dependencies
+
+- `maplibre-gl@^5.6.1` (obligatoire)
+- `geoai-kit@^0.2.0` (optionnel — primitives geo)
+
+## Licence
+
+EUPL-1.2 — Licence publique de l'Union europeenne.
+
+## Repository
+
+Source : https://github.com/nic01asFr/Passerelle/tree/main/sdk/js/geo-components
+
+Rapports de bug, discussions, roadmap et documentation etendue dans le repo.

package/examples/README.md

@@ -0,0 +1,175 @@
+# Exemples canoniques — SceneManifest V0.3.1
+
+Ce dossier contient les **8 exemples canoniques** du contract `SceneManifest V0.3.1`, un par pattern métier prioritaire de l'écosystème.
+
+Chaque exemple est **complet, valide V0.3.1**, testable via `pnpm run validate:examples`, et sert de :
+- **Contract-book pour agents LLM** (retournés par `describe_entity_schema` filtré par `use_case`)
+- **Fixtures CI cross-projet** (garantissent la non-régression sur PR de la lib)
+- **Point de départ par analogie** pour un dev démarrant un nouveau projet
+
+Voir [`../CONTRACT-V0.3.1.md`](../CONTRACT-V0.3.1.md) pour la spec complète.
+
+---
+
+## Table des exemples
+
+| # | Fichier | Pattern | Producer | Cas d'usage typique | Anti-pattern à éviter |
+|---|---|---|---|---|---|
+| 1 | [`minimal.json`](./minimal.json) | Point de départ incrémental | `manual` | Nouveau projet, prototype rapide, test agent | Rester bloqué à ce minimum en prod |
+| 2 | [`diagnostic-temporel.json`](./diagnostic-temporel.json) | Classification graduated + timeline + hillshade | `qgis-sspcloud` | Diagnostic bâti par période, storymap DSFR | Oublier `opacity.reactive` (timeline devient statique) |
+| 3 | [`corpus-documentaire.json`](./corpus-documentaire.json) | Rôles emprise/site + groupement N docs/emprise | `livrables` | Widget corpus documentaire, editeur narratif | Mélanger polygons+points dans même layer sans role |
+| 4 | [`choropleth-demographique.json`](./choropleth-demographique.json) | `classification.color.mode=expression` + interpolate | `x_crm_grist_storymap` | Choroplèthe communal, dashboard CRM | Utiliser `mode=graduated` pour continuous data (préférer expression) |
+| 5 | [`heatmap-rag.json`](./heatmap-rag.json) | Heatmap + `maplibre_paint_override` | `x_mobscidat` | RAG géo-sémantique, dashboard science des données | Créer une couche circle pour simuler heatmap (impossible) |
+| 6 | [`timeline-overlay-simple.json`](./timeline-overlay-simple.json) | Timeline `opacity.reactive` sans classification | `qgis-sspcloud` | Animation temporelle simple (événements datés) | Rajouter classification par période inutile |
+| 7 | [`multi-layers-narrative.json`](./multi-layers-narrative.json) | 3 layers avec rôles `context/primary/emprise` | `qgis-sspcloud` | Storymap narrative multi-échelles | Empiler des layers sans role (perte de sens) |
+| 8 | [`maquette-3d.json`](./maquette-3d.json) | Terrain LIDAR + sky solaire + custom_layers GLTF | `atlas` | Maquette 3D territoriale immersive | Mettre les instances GLTF dans `custom_layers.params.instances[]` (utiliser `source_layer_id`) |
+| 9* | [`validation-terrain-zebra.json`](./validation-terrain-zebra.json) | Grist bridge bidirectionnel + `feature_state.selected` | `x_zebra` | Validation terrain widget Grist | Oublier `feature_state_selected_field` (perte sync Grist↔carte) |
+
+*Exemple bonus pour illustrer le pattern `source.type: "grist_table"` + `sync: "reactive"`.
+
+---
+
+## Comment lire un exemple
+
+### Structure standard
+
+Tout exemple V0.3.1 comporte au minimum :
+- `$schema` (URL du JSON Schema publié)
+- `manifest_version: "0.3.1"`
+- `produced_at` (ISO datetime)
+- `provenance.producer` + `provenance.producer_version`
+- `title`
+- `basemap.id`
+- `zone` (discriminated union sur `kind`)
+- `layers[]` (peut être vide)
+
+Les champs immuables (`scene_hash`, `manifest_id`) sont ajoutés par le hub au moment du publish — l'agent LLM ne les produit pas.
+
+### Discriminated unions
+
+Certains sous-modèles utilisent des unions typées strictes :
+- `source.type` : `geojson | geojson_path | vector | pmtiles | grist_table | wfs | boundary_admin`
+- `classification.color.mode` : `single | categorized | graduated | expression`
+- `legend.mode` : `auto | manual`
+- `zone.kind` : `manual | commune | insee_arm | auto_bounds`
+- `opacity.kind` : `static | reactive`
+- `custom_layers.kind` : `gltf_instances | custom_3d_layer`
+
+**Un agent LLM doit choisir UNE variante par union.** Ne pas mélanger les champs de plusieurs variantes.
+
+### Extensions par-projet
+
+Chaque niveau du manifest accepte `extensions: {[prefix]: object}` avec prefix = nom projet (`x_livrables`, `x_atlas`, `x_zebra`, ...).
+
+Le contenu de chaque extension est libre (`additionalProperties: true`). Les extensions inconnues sont **ignorées** par le renderer standard.
+
+Voir `corpus-documentaire.json` (Livrables `sidebar_items`) et `maquette-3d.json` (Atlas `native_payload_hash`) pour des exemples réels.
+
+---
+
+## Anti-patterns communs à éviter
+
+### 1. `geojson_inline` catastrophique
+```jsonc
+// ❌ MAUVAIS : 22 MB payload pour 14 270 features
+"source": {
+  "type": "geojson",
+  "data": { "type": "FeatureCollection", "features": [ /* 14 270 features */ ] }
+}
+
+// ✅ BON : utilise geojson_path avec fetch séparé streamé
+"source": {
+  "type": "geojson_path",
+  "path": "/data/.../batiments.geojson"
+}
+```
+
+Seuils : `geojson` inline autorisé uniquement si `n_features ≤ 500` OU `payload ≤ 500 KB`.
+
+### 2. Discriminated union floue
+```jsonc
+// ❌ MAUVAIS : mélange champs de modes différents
+"color": {
+  "mode": "graduated",
+  "value": "#1d70b8",              // ❌ "value" appartient à mode=single
+  "categories": [ /* ... */ ],      // ❌ "categories" appartient à mode=categorized
+  "breaks": [1900, 1945]            // ✅ correct pour graduated
+}
+
+// ✅ BON : un seul mode, ses champs spécifiques
+"color": {
+  "mode": "graduated",
+  "field": "date_d_apparition",
+  "method": "manual",
+  "breaks": [1900, 1945, 1975, 2000],
+  "palette": "ColorBrewer.PRGn.6",
+  "default": "#9e9e9e"
+}
+```
+
+### 3. Enum inconnu sans convention `x_*`
+```jsonc
+// ❌ MAUVAIS : "validation-cluster" hors enum + pas de convention x_*
+"role": "validation-cluster"
+
+// ✅ BON : préfixe x_<projet>_* + fallback graceful primary
+"role": "x_zebra_validation_cluster"
+```
+
+### 4. Magic strings d'événements
+```jsonc
+// ❌ MAUVAIS : nom d'événement custom (non émis par la lib)
+"click_event": "custom-click-handler"
+
+// ✅ BON : événements canoniques fixés par la lib
+"emits_events": true
+// → émet automatiquement geo:feature-click, geo:feature-hover
+```
+
+### 5. `dimension` explicite au manifest
+```jsonc
+// ❌ MAUVAIS : dimension supprimée du contract V0.3.1
+"dimension": "3d"
+
+// ✅ BON : dérivée par le renderer selon présence de custom_layers[]
+// (rien à mettre dans le manifest)
+```
+
+---
+
+## Tests de validation
+
+Depuis `sdk/js/geo-components/` :
+
+```bash
+# Valide un exemple contre le JSON Schema canonique
+pnpm exec ajv validate -s schemas/scene_manifest.schema.json -d examples/minimal.json --spec=draft2020
+
+# Valide tous les exemples
+pnpm run validate:examples
+
+# Round-trip Zod (à venir après build:zod)
+pnpm run test:schemas
+```
+
+---
+
+## Ajout d'un nouvel exemple
+
+Un nouvel exemple `examples/<nom>.json` doit :
+
+1. Illustrer un **pattern métier distinct** des 8 existants (pas de doublon)
+2. Valider contre `schemas/scene_manifest.schema.json`
+3. Ajouter une entrée dans le tableau ci-dessus
+4. Décrire l'anti-pattern à éviter dans un usage similaire
+5. Passer les tests CI cross-projet
+
+Les nouveaux exemples deviennent **automatiquement disponibles** pour les agents LLM via `describe_entity_schema(entity_type="component", kind="interactive_map", use_case="<nom>")`.
+
+---
+
+## Références
+
+- [CONTRACT-V0.3.1.md](../CONTRACT-V0.3.1.md) — spec humaine complète du contract
+- [schemas/README.md](../schemas/README.md) — pipeline codegen 3 dialectes
+- [SPRINT-V0.2-STATUS.md](../SPRINT-V0.2-STATUS.md) — Sprint V0.2 tracker

package/examples/choropleth-demographique.json

@@ -0,0 +1,90 @@
+{
+  "$schema": "https://cerema.github.io/geo-components/schemas/scene_manifest/0.3.1.json",
+  "manifest_version": "0.3.1",
+  "produced_at": "2026-07-10T11:00:00+02:00",
+  "provenance": {
+    "producer": "x_crm_grist_storymap",
+    "producer_version": "v17.0"
+  },
+  "title": "Concentration adhérents CEREMA par EPCI",
+  "source_text": "Table Grist Organismes — CRM CEREMA V17",
+  "basemap": {
+    "id": "cartodb-positron-nolabels"
+  },
+  "zone": {
+    "kind": "manual",
+    "bbox": [-5.0, 41.3, 9.5, 51.2],
+    "center": [2.5, 46.5],
+    "zoom": 5
+  },
+  "layers": [
+    {
+      "id": "epci_metric_norm",
+      "name": "Concentration adhérents (métrique normalisée)",
+      "role": "primary",
+      "geometry_type": "polygon",
+      "source": {
+        "type": "boundary_admin",
+        "catalog_id": "epci_france"
+      },
+      "n_features": 1245,
+      "bbox": [-5.0, 41.3, 9.5, 51.2],
+      "attribute_stats": {
+        "metric_norm": {
+          "min": 0.0,
+          "max": 1.0,
+          "null_count": 12,
+          "distinct_count": 1233
+        }
+      },
+      "style": {
+        "z_index": 10,
+        "opacity": { "kind": "static", "value": 0.75 },
+        "classification": {
+          "color": {
+            "mode": "expression",
+            "expr": [
+              "interpolate",
+              ["linear"],
+              ["coalesce", ["get", "metric_norm"], 0],
+              0.0, "#f7f7f7",
+              0.25, "#c6dbef",
+              0.5, "#6baed6",
+              0.75, "#2171b5",
+              1.0, "#08306b"
+            ],
+            "default": "#e0e0e0"
+          }
+        },
+        "outline": {
+          "enabled": true,
+          "color": "#ffffff",
+          "width": 0.5
+        }
+      },
+      "interactions": {
+        "popup_template": {
+          "kind": "handlebars",
+          "body": "<h4>{{nom_epci}}</h4><p><strong>{{count_adherents}}</strong> adhérent(s)</p><p>Score : {{metric_norm}}</p>"
+        },
+        "tooltip_field": "nom_epci",
+        "hover_attributes": ["nom_epci", "count_adherents", "metric_norm"],
+        "emits_events": true
+      }
+    }
+  ],
+  "legend": {
+    "mode": "auto",
+    "from_layer": "epci_metric_norm",
+    "position": "bottom-left",
+    "format": "gradient_bar",
+    "title": "Concentration adhérents (0-1)"
+  },
+  "extensions": {
+    "x_crm_grist_storymap": {
+      "grist_table": "Organismes",
+      "metric_field": "score_norm",
+      "join_field": "code_epci"
+    }
+  }
+}

package/examples/corpus-documentaire.json

@@ -0,0 +1,170 @@
+{
+  "$schema": "https://cerema.github.io/geo-components/schemas/scene_manifest/0.3.1.json",
+  "manifest_version": "0.3.1",
+  "produced_at": "2026-07-10T10:00:00+02:00",
+  "provenance": {
+    "producer": "cerema-livrables",
+    "producer_version": "0.4.0",
+    "extensions": {
+      "cerema_livrables": {
+        "mode": "subject",
+        "corpus_version": "2026-07"
+      }
+    }
+  },
+  "title": "Livrables CEREMA — corpus Méditerranée",
+  "source_text": "CeremaDoc via Syracuse RSS + Strate — Licence Ouverte 2.0",
+  "basemap": {
+    "id": "plan-ign-v2"
+  },
+  "zone": {
+    "kind": "manual",
+    "bbox": [3.0, 42.5, 7.5, 44.5],
+    "center": [5.5, 43.5],
+    "zoom": 7
+  },
+  "layers": [
+    {
+      "id": "livrables_emprises",
+      "name": "Emprises documentées",
+      "role": "emprise",
+      "geometry_type": "polygon",
+      "source": {
+        "type": "geojson_path",
+        "path": "/data/publications/cerema-livrables/scenes/subject-corpus-mediterranee.geojson"
+      },
+      "n_features": 24,
+      "bbox": [3.0, 42.5, 7.5, 44.5],
+      "attribute_stats": {
+        "scale": { "distinct_values": ["batiment", "zone", "rue", "ville", "epci"] }
+      },
+      "style": {
+        "z_index": 10,
+        "opacity": { "kind": "static", "value": 0.35 },
+        "classification": {
+          "color": {
+            "mode": "categorized",
+            "field": "scale",
+            "categories": [
+              { "value": "batiment", "color": "#000091" },
+              { "value": "zone", "color": "#1212a3" },
+              { "value": "rue", "color": "#2e2eb5" },
+              { "value": "ville", "color": "#4a4ac7" },
+              { "value": "epci", "color": "#7676d9" }
+            ],
+            "default": "#9e9e9e"
+          }
+        },
+        "outline": {
+          "enabled": true,
+          "color": "#000091",
+          "width": 1.5
+        }
+      },
+      "interactions": {
+        "popup_template": {
+          "kind": "handlebars",
+          "body": "<h4>{{count}} livrable(s) sur {{territoire}}</h4><ul>{{#each members}}<li><a href=\"{{source_url}}\" target=\"_blank\">{{titre}}</a> ({{millesime}}) — {{commanditaire}}</li>{{/each}}</ul>"
+        },
+        "tooltip_field": "titre",
+        "hover_attributes": ["scale", "count", "territoire"],
+        "emits_events": true,
+        "feature_state_selected_field": "group_key"
+      },
+      "extensions": {
+        "cerema_livrables": {
+          "role_semantic": "emprise",
+          "group_key_field": "group_key"
+        }
+      }
+    },
+    {
+      "id": "livrables_points_approx",
+      "name": "Livrables sans emprise vérifiée",
+      "role": "site",
+      "geometry_type": "point",
+      "source": {
+        "type": "geojson_path",
+        "path": "/data/publications/cerema-livrables/scenes/subject-points-approximatifs.geojson"
+      },
+      "n_features": 6,
+      "bbox": [3.5, 42.8, 7.0, 44.0],
+      "style": {
+        "z_index": 15,
+        "opacity": { "kind": "static", "value": 0.9 },
+        "classification": {
+          "color": {
+            "mode": "categorized",
+            "field": "geom_statut",
+            "categories": [
+              { "value": "verifie", "color": "#000091" },
+              { "value": "approximatif", "color": "#e1000f" }
+            ],
+            "default": "#9e9e9e"
+          }
+        },
+        "hollow_point": {
+          "enabled": true,
+          "stroke_color_from_field": "geom_statut",
+          "radius": 8
+        }
+      },
+      "interactions": {
+        "popup_template": {
+          "kind": "handlebars",
+          "body": "<h4>{{titre}}</h4><p>Emprise : <strong>{{geom_statut}}</strong> ({{geom_source}})</p><p>{{count}} livrable(s) groupé(s)</p>"
+        },
+        "tooltip_field": "titre",
+        "emits_events": true
+      }
+    }
+  ],
+  "legend": {
+    "mode": "manual",
+    "items": [
+      { "label": "Bâtiment", "color": "#000091" },
+      { "label": "Zone / ZI", "color": "#1212a3" },
+      { "label": "Rue", "color": "#2e2eb5" },
+      { "label": "Ville", "color": "#4a4ac7" },
+      { "label": "EPCI", "color": "#7676d9" },
+      { "label": "Approximatif (point)", "color": "#e1000f" }
+    ],
+    "position": "bottom-left",
+    "format": "chips",
+    "title": "Échelle documentaire"
+  },
+  "scalebar": {
+    "position": "bottom-right",
+    "unit": "metric"
+  },
+  "extensions": {
+    "cerema_livrables": {
+      "sidebar_items": [
+        {
+          "id": "doc-uuid-1",
+          "titre": "Rapport littoral MTPM 2024",
+          "scale": "epci",
+          "zoom": 10,
+          "domaine": "Risques",
+          "commanditaire": "Métropole TPM",
+          "millesime": 2024,
+          "source_url": "https://doc.cerema.fr/...",
+          "group_key": "epci:200055529",
+          "lon": 5.926, "lat": 43.124,
+          "geom_statut": "verifie"
+        }
+      ],
+      "national": [
+        {
+          "id": "doc-nat-1",
+          "titre": "Guide méthodologique passages piétons",
+          "domaine": "Risques",
+          "commanditaire": "DGITM",
+          "millesime": 2024,
+          "source_url": "https://doc.cerema.fr/..."
+        }
+      ],
+      "count": 42
+    }
+  }
+}

package/examples/diagnostic-temporel.json

@@ -0,0 +1,160 @@
+{
+  "$schema": "https://cerema.github.io/geo-components/schemas/scene_manifest/0.3.1.json",
+  "manifest_version": "0.3.1",
+  "produced_at": "2026-07-10T09:15:23+02:00",
+  "provenance": {
+    "producer": "qgis-sspcloud",
+    "producer_version": "v1.20.6",
+    "source_project": "/data/studies/c9fef0955a53/projects/72e3da47b1f7/project.qgz",
+    "recipe_used": {
+      "slug": "diagnostic-parc-bati",
+      "version_sha": "sha256:9f8a1e7c4d2b3f5e8a1c9d0e2f3b4a5c6d7e8f9a0b1c2d3e4f5a6b7c8d9e0f1a"
+    }
+  },
+  "title": "Parc bâti du 4e arrondissement, par année de construction",
+  "subtitle": "Diagnostic CEREMA – juillet 2026",
+  "description": "Cartographie de l'ensemble du parc bâti du 4e arrondissement de Marseille à partir de la BD TOPO® de l'IGN et de son attribut de date d'apparition. Explore visuellement l'évolution du bâti au fil du temps.",
+  "source_text": "BD TOPO® IGN 2024 — CEREMA, juillet 2026",
+  "caveat": "Étude à vocation pédagogique — chiffres fictifs, non exploitables opérationnellement.",
+  "projection": "mercator",
+  "basemap": {
+    "id": "plan-ign-v2-gris"
+  },
+  "zone": {
+    "kind": "insee_arm",
+    "insee": "13204",
+    "buffer_km": 0.2,
+    "pitch": 0,
+    "bearing": 0
+  },
+  "terrain": {
+    "source_id": "ign-lidar",
+    "encoding": "mapbox",
+    "exaggeration": 1.0,
+    "adapter": "ignmnt",
+    "hillshade": {
+      "opacity": 0.35,
+      "blend_mode": "multiply"
+    }
+  },
+  "layers": [
+    {
+      "id": "batiments_bd_topo",
+      "name": "Bâtiments par période",
+      "role": "primary",
+      "geometry_type": "polygon",
+      "source": {
+        "type": "geojson_path",
+        "path": "/data/studies/c9fef0955a53/scene_store/c52d9d669bf5d09c/layers/batiments_bd_topo.geojson",
+        "crs": "EPSG:4326"
+      },
+      "n_features": 14270,
+      "bbox": [5.379, 43.289, 5.427, 43.334],
+      "attribute_stats": {
+        "date_d_apparition": {
+          "min": 1850,
+          "max": 2024,
+          "null_count": 7550,
+          "distinct_count": 195
+        }
+      },
+      "style": {
+        "visible": true,
+        "z_index": 10,
+        "opacity": {
+          "kind": "reactive",
+          "prop": "time",
+          "matched": 0.85,
+          "before": 0.85,
+          "after": 0.12,
+          "null_value": 0.35
+        },
+        "classification": {
+          "color": {
+            "mode": "graduated",
+            "field": "date_d_apparition",
+            "method": "manual",
+            "breaks": [1900, 1945, 1975, 2000],
+            "palette": "ColorBrewer.PRGn.6",
+            "default": "#9e9e9e",
+            "_compiled_expression": [
+              "step",
+              ["get", "date_d_apparition"],
+              "#7b3294",
+              1900, "#c2a5cf",
+              1945, "#f7f7f7",
+              1975, "#a6dba0",
+              2000, "#008837"
+            ]
+          },
+          "size": { "mode": "single", "value": 8 },
+          "label": { "enabled": false }
+        },
+        "outline": {
+          "enabled": true,
+          "color": "#000091",
+          "width": 0.5
+        }
+      },
+      "interactions": {
+        "popup_template": {
+          "kind": "handlebars",
+          "body": "<h4>Bâtiment {{nature}}</h4><dl><dt>Construction</dt><dd>{{date_d_apparition}}</dd><dt>Usage principal</dt><dd>{{usage_1}}</dd><dt>Logements</dt><dd>{{nombre_de_logements}}</dd><dt>Hauteur</dt><dd>{{hauteur}} m ({{nombre_d_etages}} niveaux)</dd></dl>"
+        },
+        "tooltip_field": "date_d_apparition",
+        "hover_attributes": ["nature", "usage_1", "hauteur", "nombre_de_logements"],
+        "emits_events": true
+      }
+    },
+    {
+      "id": "arrondissement_13204",
+      "name": "4e arrondissement (limite)",
+      "role": "context",
+      "geometry_type": "polygon",
+      "source": {
+        "type": "boundary_admin",
+        "catalog_id": "arrondissements_marseille",
+        "filter": { "insee_arm": "13204" }
+      },
+      "style": {
+        "visible": true,
+        "z_index": 5,
+        "opacity": { "kind": "static", "value": 0.05 },
+        "classification": {
+          "color": { "mode": "single", "value": "#000091" }
+        },
+        "outline": {
+          "enabled": true,
+          "color": "#000091",
+          "width": 2
+        }
+      },
+      "interactions": {
+        "emits_events": false
+      }
+    }
+  ],
+  "legend": {
+    "mode": "auto",
+    "from_layer": "batiments_bd_topo",
+    "position": "bottom-left",
+    "format": "chips",
+    "title": "Période de construction"
+  },
+  "scalebar": {
+    "position": "bottom-right",
+    "unit": "metric"
+  },
+  "north_arrow": {
+    "position": "top-right"
+  },
+  "counters": [
+    {
+      "id": "cnt_bati_filtered",
+      "bind": "time",
+      "expr": "filtered_count",
+      "template": "{{count}} / 14 270 bâtiments ({{pct}} %)",
+      "position": "top-left"
+    }
+  ]
+}