Widget de camadas do mapa personalizadas
Uma versão modificada do widget Camadas do Mapa do Experience Builder. Ele faz tudo o que o widget padrão faz e adiciona os recursos abaixo. Esta versão foi migrada de uma pergunta sobre widgets personalizados, onde eu tinha a versão original.
GitHub: https://github.com/brianmcleer/map-layers-custom-widget
Recursos adicionados ao widget padrão Camadas do Mapa
- Incluir automaticamente novas subcamadas: as subcamadas recém-adicionadas a um grupo designado aparecem nos aplicativos publicados sem precisar editar as configurações nem publicar novamente.
- Foco na camada: isole uma única camada ou subcamada de serviço de mapa e oculte as demais, com uma opção explícita para sair desse modo.
- Indicador da quantidade de camadas visíveis.
- Lista de camadas recolhível, com opção para iniciar recolhida.
- Adicionar dados: adicione uma camada por URL (serviço ArcGIS, bloco vetorial, WMS, WMTS, GeoJSON, CSV, KML) ou arquivo local (GeoJSON, CSV, KML, shapefile compactado).
- Opacidade geral: um controle deslizante define a opacidade de todas as camadas.
- Seletor de mapa-base que usa os mapas-base da organização.
- Painel de legenda.
- Visualizações salvas: salve conjuntos de visibilidade de camadas e exporte-os ou importe-os como JSON.
- Contagem de resultados da busca que inclui subcamadas de serviços de mapa, além de um filtro para exibir apenas as camadas visíveis.
- Ferramentas em lote: ativar ou desativar tudo, redefinir a visibilidade, aproximar para as camadas visíveis, exportar imagem do mapa, expandir ou recolher tudo.
- Ferramentas por camada: piscar, copiar URL, atualizar, detalhes da camada, mover para o topo ou para o fim, tirar do grupo.
Cada recurso pode ser ativado ou desativado nas configurações do widget.
Requisitos
Experience Builder Developer Edition 1.19 ou 1.20 (React 19). O EB 1.18 e versões anteriores não são compatíveis.
Instalação
- Baixe o arquivo zip da versão e extraia-o.
- Coloque a pasta map-layers-custom de modo que o arquivo manifest.json fique diretamente em client/your-extensions/widgets/map-layers-custom/.
- Execute npm install na pasta client.
- Reinicie o cliente e atualize a página do construtor ignorando o cache.
As instruções completas de instalação e solução de problemas estão no README do GitHub.
Registro de alterações:
10/12/2026: Agora, o widget acompanha o idioma do aplicativo (?locale=, o seletor de idioma, o perfil do ArcGIS ou o navegador) em 39 idiomas, incluindo o guia de ajuda.
Você tem seus próprios widgets personalizados? A mesma ferramenta gratuita, exb-i18n-kit, pode traduzi-los com um único comando: localize. Veja como ela preenche cada frase:
- Esri em primeiro lugar. Ela lê as traduções que já existem na sua instalação do Experience Builder, então uma frase como “Zoom to” usa a mesma tradução dos próprios widgets da Esri.
- Termos padrão. Nomes de unidades, como pés e acres, vêm do Unicode CLDR, os mesmos dados usados pelos navegadores.
- Memória de tradução compartilhada. O restante vem de um dicionário compartilhado criado com o LibreTranslate, um tradutor de código aberto, além dos modelos Opus-MT da Helsinki-NLP para bósnio, croata e sérvio. A ferramenta funciona gratuitamente no GitHub, então você não precisa de uma chave de API nem de uma conta.
- Integração. Ela também encontra textos em inglês fixados no código fora do arquivo de tradução do widget, como uma configuração padrão ou um guia de ajuda, e os conecta para que também sejam traduzidos.
As correções manuais sempre prevalecem sobre as feitas pela máquina e nunca são substituídas. Algumas traduções são geradas por máquina; se notar algo estranho, responda aqui com uma sugestão melhor.
30/09/26:
- Escolher uma camada por grupo: configure um grupo para que apenas uma camada possa ficar ativada por vez (botões de opção).
- Copiar link para estas camadas: compartilhe um link que abra o aplicativo com as mesmas camadas ativadas.
- Exportar lista de camadas: salve todas as camadas, grupos e subcamadas, com seus estados de ativação e URLs, em um arquivo CSV.
- Verificação de integridade das camadas: os serviços são verificados periodicamente, e os que deixam de responder são marcados na lista.
- Relatórios de camadas com falha: as camadas que não carregam ou não são desenhadas são reportadas, mesmo quando estão aninhadas em grupos mais profundos.
- Visualizações predefinidas: o criador do aplicativo pode salvar visualizações de camadas que todos os usuários verão.
- Imagens da região: adicione imagens aéreas e de satélite que abrangem a visualização atual.
- Favoritos: marque camadas com uma estrela e filtre a lista para mostrar apenas as favoritas.
- Nomes de camadas simplificados: opção para exibir nomes mais limpos, substituindo, por exemplo, sublinhados por espaços.
- Aproximar até ficar visível: um clique aproxima a visualização de uma camada esmaecida na escala atual.
- Telemetria de uso: os cliques nas camadas agora incluem o caminho do grupo da camada.
11/09/26:
Adicionado um botão Ajuda no cabeçalho, que abre um guia breve e pesquisável, descrevendo apenas os recursos ativados no aplicativo, além de uma dica exibida uma única vez: “Primeira vez aqui?”.
23/07/26: O widget Camadas do Mapa Personalizadas foi atualizado para ser compatível com o Experience Builder 1.21, e os erros do editor TypeScript foram corrigidos. Esta é apenas uma atualização de manutenção, sem alterações na funcionalidade do widget.
