Aperçu
GitHub :
https://github.com/brianmcleer/time-machine-widget
Time Machine est un widget personnalisé pour Experience Builder Developer Edition 1.19 et versions ultérieures (testé avec la version 1.21). Il ajoute un curseur de date à la carte et synchronise toutes les couches datées avec celui-ci. Faites glisser le curseur jusqu’à une date pour voir sur la carte ce qui s’y trouvait à ce moment-là.
Il n’a pas besoin de services compatibles avec les données temporelles. Le widget lit les champs de chaque couche, sélectionne le champ de date et applique un filtre en plus de celui déjà présent sur la couche. Les couches d’entités sont filtrées dans la vue de couche du navigateur. Les couches d’images cartographiques comportant des sous-couches datées sont filtrées à l’aide d’une expression de définition, puis une nouvelle image est demandée après chaque modification.
Nous l’avons conçu pour retracer l’histoire de nos annexions, qui remonte à 1882 et est conservée dans un service cartographique comprenant une sous-couche par année ou décennie. Il fonctionne aussi sur une seule couche d’entités dotée d’un champ de date.
(Désolé pour la capture d’écran, le nouvel Esri Community n’accepte pas les fichiers vidéo)
Fonctionnalités
- Modes « À la date », « Plage » et « Comparaison ». Le mode Comparaison affiche deux dates côte à côte, séparées par un curseur que vous pouvez déplacer.
- Avance par jour, mois ou année, ou par intervalles de N jours, mois ou années grâce à une option avancée. Lecture avec réglage de la vitesse, boucle, boutons « Réinitialiser » et « Aujourd’hui », ainsi que « Modification précédente » et « Modification suivante » pour passer d’une date à l’autre où un événement s’est produit.
- La plage du curseur est déterminée par les données : elle couvre les dates les plus anciennes et les plus récentes des couches activées, et est recalculée lorsque des couches sont activées ou désactivées dans la carte.
- Graphique d’activité indiquant le nombre d’entités par année ou par mois sur les deux axes.
- Liste des couches indiquant celles qui suivent le curseur, le champ de date utilisé par chacune et la raison pour laquelle une couche a été ignorée.
- Mode présentation : grande bannière de date sur la carte avec lecture, chapitres, grille de chapitres avec vignettes, mise en évidence, dessin sur la carte, affichage en noir et blanc, lecture à voix haute, fenêtre du présentateur avec notes et horloge, raccourcis clavier, liens pour borne interactive et bouton de vitesse. Les chapitres peuvent définir des couches, un fond de carte, un lieu, un parcours ou une coupe, une fenêtre contextuelle d’entité et une durée d’affichage. Les couleurs, la police et le logo de la bannière se définissent dans le générateur.
- Chapitres d’histoire créés à l’exécution à partir de la vue actuelle ou générés à partir des années les plus riches en données, avec exportation en diaporama Web, vidéo WebM ou XML pour le générateur.
- Paramètres du générateur avec un sélecteur de couches alimenté par la carte (couches de groupe affichées comme titres), des règles pour les couches invisibles dans le sélecteur, des ensembles d’années pour les groupes d’instantanés annuels, des sections consacrées aux performances, à la présentation et à l’image de marque, ainsi que l’importation et l’exportation XML de toute la configuration.
- Guide d’aide intégré au widget, indication au premier lancement, prise en charge du clavier et annonces pour les lecteurs d’écran dans toute l’interface.
Configuration requise
- Experience Builder Developer Edition 1.19 ou version ultérieure, React 19. Testé avec la version 1.21 et Maps SDK 5.x.
- Aucune dépendance tierce. Tout provient d’Experience Builder.
Installation
- Téléchargez le fichier zip depuis la dernière version publiée sur GitHub (également joint ici).
- Copiez le dossier
time-machine dans client\your-extensions\widgets\ afin que manifest.json se trouve directement dans widgets\time-machine\. Ne l’imbriquez pas dans un sous-dossier supplémentaire. - Exécutez
pnpm install (version 1.21 et ultérieure) ou npm install (version 1.20 et antérieure) dans le dossier client et redémarrez le client. - Ajoutez Time Machine à une expérience et sélectionnez le widget cartographique qu’il doit piloter.
Le fichier zip ne contient que le widget. Les extensions de l’éditeur Visual Studio présentes dans le dépôt sont volontairement exclues, car leurs déclarations de modules globales affecteraient tous les autres widgets de votre dossier your-extensions. Si vous clonez plutôt le dépôt, supprimez ces fichiers avant la compilation ; ils sont indiqués dans le fichier README.
Limites connues
- Les couches de tuiles et les couches d’imagerie ne sont gérées qu’au moyen d’ensembles d’années (couches de groupe dont les enfants sont nommés par année).
- Un service cartographique génère une image par modification. Par conséquent, sur un service lent, la lecture affiche moins d’images que le nombre d’étapes. La date continue d’avancer à son rythme et la carte affiche la date la plus récente qu’elle peut charger.
- Le mode côté client lit jusqu’au nombre maximal d’entités par couche défini dans le générateur (50 000 par défaut). Pour les couches plus volumineuses, la plage est calculée à partir des statistiques du serveur.
- La lecture à voix haute utilise les voix du navigateur et nécessite un premier clic sur la page. L’exportation vidéo est au format WebM.
Commentaires
Les signalements de problèmes et les demandes de fusion sont les bienvenus sur GitHub. Si une couche est ignorée ou si la plage semble incorrecte, la liste des couches du widget en indique la raison, et la console du navigateur affiche une ligne commençant par [time-machine] qui fournit davantage de détails.
Historique des modifications
10/12/2026 : Le widget suit désormais la langue de l’application (?locale=, le sélecteur de langue, le profil ArcGIS ou le navigateur) dans 39 langues, y compris le guide d’aide.
- Esri d’abord. Il récupère les traductions déjà présentes dans votre installation d’Experience Builder. Ainsi, une expression comme « Zoom to » reprend la formulation utilisée dans les widgets d’Esri.
- Termes normalisés. Les noms d’unités, comme pieds et acres, proviennent d’Unicode CLDR, la même base de données que celle utilisée par les navigateurs.
- Mémoire de traduction partagée. Les éléments restants proviennent d’un dictionnaire partagé créé avec LibreTranslate, un traducteur libre, ainsi qu’avec les modèles Opus-MT d’Helsinki-NLP pour le bosnien, le croate et le serbe. L’outil fonctionne gratuitement sur GitHub : vous n’avez donc besoin ni d’une clé API ni d’un compte.
- Intégration. L’outil repère aussi les textes anglais codés en dur en dehors du fichier de traduction du widget, comme un paramètre par défaut ou un guide d’aide, puis les relie au système de traduction.
Les corrections manuelles sont toujours prioritaires par rapport aux traductions automatiques et ne sont jamais écrasées. Certaines traductions sont générées automatiquement ; si vous en repérez une qui ne convient pas, répondez ici en proposant une meilleure formulation.
9/25/26 : 1.0.0. Première version publique, publiée sur GitHub avec une archive zip.
