Visão geral
GitHub:
https://github.com/brianmcleer/time-machine-widget
Time Machine é um widget personalizado para ArcGIS Experience Builder Developer Edition 1.19 e posteriores (testado na 1.21). Ele coloca um controle deslizante de data no mapa e faz com que todas as camadas datadas o sigam. Arraste para uma data e o mapa mostra o que havia naquela data.
Não precisa de serviços habilitados para tempo. O widget lê os campos de cada camada, escolhe o campo de data e aplica um filtro além do filtro que a camada já possui. Camadas de feição são filtradas na visualização da camada no navegador. Camadas de imagem de mapa com subcamadas datadas são filtradas com uma expressão de definição e solicitam uma nova imagem após cada alteração.
Construímos para nossa história de anexação, que remonta a 1882 e está em um serviço de mapa com uma subcamada por ano ou década. Também funciona em uma única camada de feição com um campo de data.
(Desculpe pela captura de tela, a nova Esri Community não aceita arquivos de vídeo)
O que ele faz
- Modos As of, Range e Compare. Compare mostra duas datas lado a lado atrás de um divisor que você pode arrastar.
- Avance por dia, mês ou ano, ou a cada N desses a partir de uma opção Avançada. Controle a velocidade, loop, Resetar e Hoje, além de Alteração anterior e Próxima alteração para pular entre datas onde algo aconteceu.
- O intervalo do controle deslizante vem dos dados: ele se ajusta às datas mais antigas e mais recentes das camadas ativadas e se reajusta quando camadas são ligadas ou desligadas no mapa.
- Gráfico de atividade com feições por ano ou mês em ambos os eixos.
- Uma lista de camadas que mostra quais camadas seguem o controle deslizante, qual campo de data cada uma usa e por que uma camada foi ignorada.
- Modo apresentação: um grande banner de data no mapa com play, capítulos, uma grade de capítulos com miniaturas, destaque, desenho no mapa, tela em preto e branco, leitura em voz alta, janela do apresentador com notas e relógio, atalhos de teclado, links para quiosque e botão de velocidade. Capítulos podem definir camadas, mapa base, um local, um voo ou corte, um popup da feição e tempo de espera. Cores, fonte e logo do banner são configurados no builder.
- Capítulos da história feitos em tempo real a partir da vista atual ou gerados dos anos mais movimentados nos dados, com exportação para slideshow web, vídeo WebM ou XML para o builder.
- Configurações do builder com seletor de camadas lido do mapa (camadas agrupadas como títulos), regras para camadas que o seletor não vê, conjuntos anuais para grupos de snapshots anuais, seções de desempenho, apresentação e branding, além da importação e exportação XML da configuração completa.
- Guia de ajuda dentro do widget, dica na primeira execução, acesso por teclado e anúncios para leitor de tela em todo o widget.
Requisitos
- Experience Builder Developer Edition 1.19 ou posterior, React 19. Testado na 1.21 com Maps SDK 5.x.
- Sem dependências terceirizadas. Tudo vem do Experience Builder.
Instalar
- Baixe o zip da última versão no GitHub (anexado aqui também).
- Copie a pasta
time-machine para client\your-extensions\widgets\ para que manifest.json fique diretamente dentro de widgets\time-machine\. Não aninhe em um segundo nível. - Execute
pnpm install (1.21 e posteriores) ou npm install (1.20 e anteriores) na pasta client e reinicie o client. - Adicione Time Machine a uma experiência e selecione o widget do mapa que ele controla.
O zip contém apenas o widget. Os shims do editor Visual Studio no repositório foram deixados fora propositalmente porque suas declarações ambientais afetariam todos os outros widgets na sua pasta your-extensions. Se você clonar o repositório em vez disso, exclua esses arquivos antes da compilação; o README lista eles.
Limites conhecidos
- Camadas tile e imagens são controladas apenas por conjuntos anuais (camadas agrupadas cujos filhos são nomeados por ano).
- Um serviço de mapa desenha uma imagem por alteração; então em um serviço lento Play mostra menos imagens que passos. A data mantém seu ritmo e o mapa mostra a data mais recente possível.
- O modo client side lê até um limite do builder de feições por camada (50.000 por padrão). Camadas maiores usam estatísticas do servidor para o intervalo.
- Leitura em voz alta usa as vozes do navegador e precisa de um clique na página primeiro. Exportação de vídeo é WebM.
Feedback
Problemas e pull requests são bem-vindos no GitHub. Se uma camada for ignorada ou o intervalo parecer errado, a lista de camadas no widget diz o motivo, e o console do navegador tem uma linha começando com [time-machine], que explica o resto.
Registro de alterações
- 25 setembro 2026: 1.0.0. Primeira versão pública no GitHub com arquivo zip da release.