Skip to content
GeoViewer 5

Toc

Toc

Nom fonctionnel: Table des contenus

À quoi sert ce widget ?

Pilote la table des contenus: visibilité, ordre, opacité, actions couche et accès aux outils liés.

Conseil: un viewer “trop outillé” devient vite bruyant. Activez ce widget uniquement s’il sert un parcours utilisateur clair.

Quand l’activer

  • Quand l’utilisateur doit piloter sa vue (zoom, couches, plein écran, repérage).
  • Quand vous voulez des contrôles cohérents et immédiatement compréhensibles, quel que soit le moteur cartographique.
  • Quand vous cherchez à réduire les frictions (moins de clics, moins d’aller-retour, plus de lisibilité).

En clair

  • Côté utilisateur: Le confort d’usage augmente fortement dès la première prise en main.
  • Côté intégration: Vérifiez la cohérence entre projection, échelle, coordonnées et basemaps.

Prise en main

Accéder au widget

  • Ouvrez le widget depuis la barre d’outils (ou via son bouton dédié).
  • Vérifiez son emplacement et sa lisibilité (desktop et mobile).

Le configurer sans se tromper

  • Choisissez un conteneur adapté (toolbar, drawer, dialog) pour éviter de masquer la carte.
  • Validez les interactions avec les autres widgets (raccourcis, activation simultanée, conflits).

Ce que l’utilisateur voit

  • Arborescence des couches et actions couche par couche.
  • Contrôles rapides: visibilité, opacité, ordre, zoom, suppression.
  • Accès direct à l’ajout de données depuis l’entête du panneau.

Parcours utilisateur (le plus courant)

  • Activez/désactivez les couches avec le bouton œil.
  • Ajustez l’opacité et l’ordre d’affichage selon le besoin.
  • Ouvrez les actions secondaires pour exporter, zoomer, retirer ou documenter une couche.

Exemples concrets

  • Accélérer la lecture de carte (moins de clics pour zoomer, afficher/masquer, contextualiser).
  • Donner un repère clair à l’utilisateur (échelle, coordonnées, état de la vue).
  • Réduire les frictions sur les actions répétitives (plein écran, recentrage, bascule de contexte).

Configuration (aperçu)

OptionTypeDéfautDescription
widgetIdstring-Identifiant unique de l’instance Toc.
activebooleanfalseActive l’ouverture du widget au démarrage.
inToolbarboolean ou objet ou stringselon widgetDéfinit si le widget est visible dans une toolbar, et sous quelle forme.
containerstring ou objetselon widgetChoisit le conteneur de rendu (drawer, dialog, floating, toolbar-tabs, hidden).

Pour le détail complet (et toujours à jour), utilisez la référence technique et le schéma ci-dessous.

Liens techniques et code

Exemple minimal (copier-coller)

{
    "widgetId": "toc",
    "widgetClass": "Toc",
    "active": false,
    "inToolbar": true,
    "config": {}
}

Exemple avancé

{
    "widgetId": "toc-advanced",
    "widgetClass": "Toc",
    "active": true,
    "handleOpenAtStartup": false,
    "inToolbar": {
        "type": "button",
        "toolbarId": "default-toolbar",
        "order": 10
    },
    "onActivate": {
        "deactivate": {
            "classes": []
        }
    },
    "config": {}
}

Points d’attention

  • Un bouton peut être bien configuré mais masqué par le conteneur.
  • La géolocalisation dépend des permissions navigateur et du HTTPS.
  • Le comportement peut différer légèrement entre moteurs cartographiques.

Dépannage

SymptômeVérification rapide
Le bouton est visible mais inactif.Vérifiez l’état active et les interactions concurrentes.
Le recentrage est imprécis.Contrôlez la projection et les coordonnées utilisées.

FAQ

Ces widgets sont-ils adaptés au mobile ?

Oui, avec des ajustements d’ergonomie selon la taille écran.

Peut-on les regrouper dans la même toolbar ?

Oui, c’est recommandé pour un parcours simple.

Captures à ajouter

  • (Capture à ajouter) /assets/screenshots/TODO/toc-01.png: widget ouvert avec configuration standard.
  • (Capture à ajouter) /assets/screenshots/TODO/toc-02.png: interaction principale et résultat attendu.

Liens PDF source

  • US007 - Table de contenu_23bc7dc00b464b029b78cc185ba67fae-120226-0856-82.pdf
  • US029 - Voyage dans le temps_3b912e6102f74fbeaaa932a15670b5ac-120226-0858-122.pdf

Aller plus loin