Um mapa base personalizado é a base visual exibida sob locais, rotas, limites e dados em tempo real de um produto. Sua criação exige hierarquia clara, rótulos legíveis, acessibilidade em diferentes temas, renderização eficiente e atribuição correta das fontes; não basta aplicar a cor da marca a todas as vias. O Kaleidr Studio permite criar tiles, cores, tipografia, rótulos, ícones, camadas, relevo e predefinições reutilizáveis. Com o Kaleidr SDK, você pode incorporar o mapa base projetado ou carregar o estilo publicado diretamente no MapLibre.
As seções a seguir percorrem a tarefa do produto e os tokens de design, a hierarquia de camadas, a tipografia, os ícones, o relevo, o fluxo de trabalho do Studio, dois caminhos de implantação, licenciamento, acessibilidade e verificações de lançamento. Siga toda a sequência para preparar um estilo de produção; se o design já estiver concluído, avance diretamente para a opção 1 ou a opção 2.
O que é um mapa base personalizado de marca?
Um mapa base é a tela geográfica abaixo das informações específicas do produto em um mapa. O mapa de base normalmente contém características de referência, como terra e água, estradas e caminhos, edifícios, parques e uso do solo, limites administrativos, etiquetas de local e estrada, terreno ou asalhe e pontos de interesse selecionados para o contexto. Um mapa base de marca aplica um sistema de design deliberado a esses recursos, de modo que o mapa pertence visualmente ao produto circundante. O resultado deve se sentir consistente com as cores, tipo, espaçamento, tom e prioridades de informação do aplicativo sem sacrificar a legibilidade geográfica.
A Especificação Estilo MapLibre define um estilo de mapa como um documento JSON que controla quais dados desenhar, a ordem em que desenhar e como o renderizador deve visualizá-lo. As fontes identificam os dados disponíveis; as camadas fazem referência a essas fontes e definem propriedades visuais, como cor, largura, opacidade, ícones e texto. Esse modelo faz de um mapa base de marca um ativo de produto reutilizável, em vez de uma coleção de cores de marcadores ad hoc.
Qual é a diferença entre mapa base, sobreposições e dados do aplicativo?
Um mapa confiável separa a geografia de referência da informação que os usuários vieram ver. O mapa base fornece um contexto geográfico estável. As sobreposições de produtos representam o assunto da aplicação. As camadas de interação mostram o estado temporário do usuário ou do sistema. As camadas de interface suportam controles e explicações. O mapa base geralmente deve ser mais silencioso do que a sobreposição do produto para que os dados operacionais permaneçam dominantes.
| Tipo de camada | Propósito | Exemplos |
|---|---|---|
| Mapa base | Suprimentos contexto geográfico estável | Estradas, água, edifícios, parques, rótulos, limites |
| oposição do produto | Representa o assunto do aplicativo | Propriedades, lojas, incidentes, ativos, áreas de serviço, rotas |
| Camada de interação | Mostra o estado temporário do usuário ou do sistema | Local selecionado, estado de pairo, resultado de IA, polígono de pesquisa, visualização de rota |
| Camada de interface | Suporta controles e explicações | Legenda, filtros, painel de chat, dicas de ferramentas, atribuição, mensagens de status |
Uma plataforma de propriedade pode silenciar edifícios comuns para que as listagens ativas se destaquem. Um produto de mobilidade pode enfatizar a hierarquia rodoviária, reduzindo os pontos de interesse não relacionados. Um guia de turismo pode preservar pontos de referência e contexto de pedestres, usando um tratamento visual mais forte para destinos selecionados. O branding torna-se útil quando melhora essa hierarquia; um mapa que apenas usa mais cor de marca pode se tornar mais difícil de ler.
O que você vai criar?
Este guia produz um fluxo de trabalho de mapa base de marca reutilizável com um resumo de design vinculado à tarefa de mapa real do produto, um sistema de token controlado para cores, tipografia, rótulos, linhas e superfícies, uma hierarquia de camada que mantém os dados do aplicativo dominantes, testes claros, escuros e de alto contraste, atribuição OpenStreetMap e verificações de entrega de tiles, uma opção de embed de teste hospedado no Kaleidr, um estilo de teste direto
Atualmente, a Kaleidr documenta cinco identificadores de estilo integrados para seu produto de mapa base projetado: kaleidr-morning, kaleidr-afternoon, kaleidr-night, kaleidr-editorial e kaleidr-plain. O Kaleidr Studio descreve separadamente cores personalizadas, tipografia, rótulos, ícones, conjuntos de dados, sobreposições, predefinições reutilizáveis, terreno, edifícios 3D e hillshade. A documentação do desenvolvedor público demonstra como servir um estilo projetado, mas não documenta todas as etapas de publicação do Studio para IDs de estilo personalizados específicos da organização. Confirme o fluxo de trabalho e o identificador final de publicação dentro da interface atual do Studio antes da implantação da produção.
Como começar pela tarefa do produto?
Um forte mapa base começa com uma decisão do produto, não um selecionador de cores. Pergunte qual é a tarefa principal do usuário, quais recursos geográficos ajudam a completar essa tarefa, quais recursos distraem dela, quais informações devem permanecer legíveis a cada zoom, quais sobreposições de produtos precisam do contraste mais forte, se o mapa aparece ao lado de uma interface densa ou como uma experiência em tela cheia, se o mesmo estilo deve servir a área de trabalho, celular, capturas de tela e visualizações incorporadas e se o produto precisa de variantes de dia, noite ou acessibilidade. Um localizador de lojas e um painel logístico não devem compartilhar a mesma ênfase geográfica simplesmente porque compartilham um logotipo.
Para um localizador de lojas, priorize estradas principais e locais, rótulos de bairro e cidade, marcos reconhecíveis, marcadores de lojas claros e contexto de rota, reduzindo categorias menores de uso da terra, rótulos de negócios não relacionados, terreno decorativo e ênfase detalhada da construção em pequenas escalas. Para a descoberta de imóveis, priorize nomes de bairros, trânsito, parques e água, hierarquia de ruas, construção de pegadas em zoom próximo e sobreposições de propriedades ou áreas de pesquisa. Para um painel de operações, priorize estradas, áreas de serviço, limites administrativos e contexto de ativos, com superfícies escuras ou de baixo cromo que suportam cores de alerta, estados selecionados e não selecionados e rótulos estáveis que não obscurecem marcadores de incidentes.
Como definir um sistema de tokens de design cartográfico?
Crie tokens de mapa antes de editar camadas individuais. Os tokens mantêm o estilo coerente e tornam as futuras variantes mais fáceis de manter. Um conjunto de tokens prático inclui superfícies, redes, rótulos e acentos operacionais:
map.background
map.land
map.water
map.park
map.building
map.boundary
map.road.motorway
map.road.primary
map.road.secondary
map.road.local
map.road.casing
map.label.country
map.label.city
map.label.neighborhood
map.label.road
map.label.poi
map.label.halo
map.overlay.primary
map.overlay.secondary
map.selection
map.warning
map.route
Não mapeie todos os tokens diretamente para uma cor de marketing corporativo. Os sistemas de marca de produtos geralmente incluem cores projetadas para botões ou ilustrações que falham em uma tela geográfica densa. Use as cores da marca seletivamente para sobreposições de produtos ativos, recursos selecionados, rotas, áreas de pesquisa, chamadas primárias para ação e um pequeno número de recursos de referência significativos. Use cores neutras contidas para a maioria da geografia de referência.
Como construir a hierarquia visual?
A Especificação Estilo MapLibre lista as camadas em ordem de desenho. Camadas posteriores geralmente se desenham acima de camadas anteriores, portanto, a ordem da camada faz parte da arquitetura de informações. Uma pilha de mapa base comum coloca fundo, cobertura e terreno terrestre, água, parques e uso do solo, edifícios, estradas e invólucros rodoviários, limites, rótulos de lugares, rótulos de estradas e pontos de interesse contextuais abaixo das sobreposições de produtos e estados de interação. A ordem exata depende do renderizador e do estilo, mas o princípio permanece estável: grandes superfícies geográficas ficam abaixo das redes, rótulos e informações específicas do produto.
Toda camada não precisa de igual saturação, opacidade ou detalhe. Controles úteis incluem reduzir a opacidade de polígonos de baixa prioridade, reduzir o contraste de estrada menor em pequenos zooms, esconder pontos de interesse de baixo valor, mostrar pegadas de construção somente após um limite de zoom útil, limitar os limites administrativos às escalas onde eles ajudam a orientação e atrasar as etiquetas de rua locais até que o usuário esteja perto o suficiente para precisar delas. Um mapa base silencioso aumenta a clareza percebida dos dados do aplicativo sem deixar o mapa vazio.
O estilo de estrada geralmente requer hierarquia e invólucro. Considere a auto-estrada através de classes de serviço, largura por zoom, revestimento de linha sob o enchimento da estrada, túneis e pontes, rampas e estradas divididas, caminhos pedestres e ciclovias, e densidade de etiquetas. Uma cor de marca aplicada a cada estrada cria uma rede plana em que nada parece mais importante do que qualquer outra coisa. Use largura, brilho, invólucro e mudanças de tonalidade controlada para estabelecer hierarquia e revelar estradas locais apenas em escalas mais próximas.
Como projetar rótulos, ícones e contraste?
A tipografia é um dos sinais de marca mais fortes em um mapa, mas a renderização de rótulos tem restrições técnicas. Um documento de estilo pode referenciar recursos de glifo através de um modelo de URL. A Especificação de Estilo MapLibre requer URLs de glifo para incluir espaços reservados {fontstack} e {range}, enquanto os recursos de sprite fornecem ícones e padrões referenciados por camadas de símbolos. Uma fonte nomeada em um sistema de design não está automaticamente disponível para o renderizador de mapas; o conjunto de glifos deve ser servido no formato e na cobertura esperadas pelo estilo.
Definir funções de rótulo em vez de aplicar um tamanho de fonte em todos os lugares: país, região ou estado, cidade, bairro, estrada, trânsito, ponto de interesse, corpo de água e anotação do produto. Use tamanho e peso para hierarquia, espaçamento de letras contidos, halos para contraste sobre a mudança de geografia, cores diferentes para etiquetas de água, administrativas e rodoviárias, quando útil, limites de zoom que impedem o aglomeração e a cobertura de idioma e script apropriado para o público. Teste rótulos sobre as regiões mais claras e escuras do mapa, porque um rótulo que parece correto sobre a terra pode desaparecer sobre a água, terreno ou uma camada de satélite.
Os ícones do mapa devem operar como um sistema de símbolos compactos. A especificação de sprite do MapLibre usa recursos de imagem e metadados de sprite para disponibilizar ícones e padrões para símbolos e preencher camadas. Antes de adicionar ícones de marca, defina um estilo de curso e preenchimento consistente, tamanho mínimo renderizado, variantes claras e escuras, estados selecionados e não selecionados, significado semântico, regras de colisão e sobreposição e equivalentes de texto acessíveis fora da tela. Não force o logotipo corporativo em todos os marcadores de ponto de interesse. A repetição reduz a clareza do mapa e pode fazer com que a interface pareça promocional em vez de funcional.
Quando adicionar relevo e elementos 3D?
Kaleidr Studio descreve o apoio para elevação, terreno, sombra de colina e edifícios extrudados. MapLibre também documenta terreno e camadas fill-extrusion para edifícios 3D. Use esses recursos quando melhorar a compreensão espacial do usuário: terreno para fluxos de trabalho ao ar livre, mobilidade, infraestrutura e risco; hillshade para contexto de forma terrestre; edifícios 3D para orientação urbana em grande escala; e extrusões para altura ou volume que importa para a tarefa. Evite 3D quando obscurece marcadores, aumenta o ruído visual, cria carga desnecessária de GPU, torna as etiquetas mais difíceis de ler ou implica precisão que os dados de origem não suportam. Um mapa de marca não é mais forte apenas porque é mais dimensional.
O mapa base e os dados do aplicativo devem permanecer separados sempre que possível. As fontes do MapLibre indicam quais dados o mapa deve exibir, enquanto as camadas definem como renderizá-los. A mesma fonte pode suportar várias camadas visuais, como um preenchimento de polígono, contorno, estado selecionado e rótulo. Para sobreposições de produtos, defina propriedade de origem, identificadores estáveis, tipo de geometria, frequência de atualização, faixa de zoom, regras de filtragem, estados selecionados e pairando, estados de erro e vazio e restrições de privacidade. Mantenha as cores operacionais distintas das cores do mapa base para que um alerta vermelho não compita com estradas vermelhas e uma região selecionada azul não desapareça na água azul.
Como criar o mapa no Kaleidr Studio?
O Kaleidr Studio usa um Prompt → Processo → Refinar → Implantar fluxo de trabalho e descrever controles personalizados de design, conteúdo, estilo e interação. Para um mapa base de marca, defina o propósito do mapa, escolha uma direção visual, defina cores e hierarquia, configure tipografia e rótulos, adicione ou reutilize camadas, avalie terreno e 3D apenas quando melhorar a compreensão, testar locais representativos e zooms, publicar o mapa base projetado e incorporar ou carregar o estilo. A página pública do Kaleidr no Studio confirma as áreas de design disponíveis, mas os controles de publicação específicos da organização podem evoluir. Grave capturas de tela e o identificador de estilo final como parte do processo de lançamento.
Qual caminho de implantação escolher?
A Kaleidrir documenta dois modelos de implementação para um mapa base projetado. A incorporação de tiles possui sua própria superfície de mapa e recebe atualizações da câmera através da interface de incorporação do SDK. O mapeamento direto do MapLibre aponta um mapa de propriedade do host no JSON de estilo publicado para que o aplicativo possa adicionar suas próprias fontes, camadas e interações. Escolha a incorporação quando a velocidade de implementação for importante e o mapa base pode possuir sua superfície. Escolha MapLibre quando o host precisar de controle completo do renderizador.
Opção 1: incorporar o mapa base da Kaleidr
O exemplo a seguir é adaptado da documentação oficial atual. Use uma chave publicável restrita a origens permitidas; o SDK troca a chave por uma sessão de curta duração e com destino a origem. A chave precisa do escopo de capacidade maps para tiles. As chaves da API estão atualmente incluídas nos planos Pro e Enterprise. Consulte Obter uma chave de API e Tiles — incorpore um mapa base projetado.
<script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js"></script>
<kaleidr-map
product="tile"
publishable-key="YOUR_PUBLISHABLE_KEY"
style-id="kaleidr-morning"
center="-0.12,51.5"
zoom="11"
style="height: 480px">
</kaleidr-map>
Os atuais IDs de estilo embutido são kaleidr-morning, kaleidr-afternoon, kaleidr-night, kaleidr-editorial e kaleidr-plain. Use a opção de incorporação quando o mapa base pode possuir sua própria superfície de mapa, a velocidade de implementação importa, o aplicativo pode se comunicar através da interface de incorporação documentada e a equipe não precisa de controle direto sobre cada método de renderizador.
Opção 2: carregar o estilo diretamente no MapLibre
O Kaleidr também documenta o uso do mesmo mapa base diretamente em um mapa MapLibre controlado pelo aplicativo por meio do JSON de estilo publicado. A URL de estilo e o identificador integrado abaixo vêm do guia atual da Kaleidr Usar um mapa base projetado. Para um estilo personalizado específico da organização, substitua pela URL de estilo publicada no fluxo de trabalho atual do Studio.
<link
href="https://unpkg.com/maplibre-gl@6.0.0/dist/maplibre-gl.css"
rel="stylesheet"
/>
<div id="map" aria-label="Branded interactive map"></div>
<script type="module">
import * as maplibregl
from "https://unpkg.com/maplibre-gl@6.0.0/dist/maplibre-gl.mjs";
const map = new maplibregl.Map({
container: "map",
style: "https://cdn.kaleidr.com/styles/kaleidr-morning.json",
center: [-0.12, 51.5],
zoom: 11
});
map.addControl(new maplibregl.NavigationControl());
map.on("error", (event) => {
console.error("Basemap or renderer error:", event.error ?? event);
});
</script>
Use a opção MapLibre direta quando o aplicativo host precisa de acesso direto à instância do mapa, as sobreposições do produto devem ser adicionadas como fontes e camadas, a equipe precisa de controle preciso sobre eventos, câmera, controles e estilo de tempo de execução, ou o mapa base é uma parte de um aplicativo interativo maior.
Como versionar e armazenar a integração em cache?
A Kaleidr atende aos pacotes de carregadores e produtos por meio de caminhos com versão, como https://cdn.kaleidr.com/embed/v1/kaleidr.js e https://cdn.kaleidr.com/embed/v1/tile.js. As atualizações compatíveis com versões anteriores enviam sob o mesmo caminho principal. Uma incorporação de quebra ou mudança pós-Mensagem usaria um novo caminho principal, como o /embed/v2/. Kaleidr desaconselha impressões digitais ou auto-hospedagem dos pacotes do SDK, a menos que a equipe pretenda fixar uma compilação específica de forma independente. Ver CDN versioning.
Ativos de estilo e tiles também devem usar uma estratégia explícita de cache e lançamento: versões mudanças de estilo significativas, evite substituir um estilo de produção sem teste de regressão, registrar o ID e a data de estilo publicado, testar a invalidação do cache do sprite e do glifo, preservar um alvo de reversão e monitorar solicitações de estilo, azulejo, sprite e glifo com falha.
Quais regras de atribuição e uso de tiles se aplicam?
Os dados do OpenStreetMap são dados abertos, mas a atribuição continua sendo necessária. O OpenStreetMap afirma que os usuários podem usar os dados para qualquer finalidade, desde que creditem o OpenStreetMap e seus colaboradores. A página de preços da Kaleidr afirma que seus dados de mapa base aberto derivam do OpenStreetMap e do Overture Maps e requer atribuição aos contribuidores do OpenStreetMap onde quer que os blocos apareçam. Veja a Página de direitos autorais do OpenStreetMap; a OpenStreetMap Foundation também publica diretrizes de atribuição para mapas interativos e outros trabalhos produzidos.
Não confunda dados abertos com uso ilimitado dos servidores de tiles públicos da OpenStreetMap Foundation. A política de uso de tiles da OSMF explica que o serviço público de tiles raster limitou a capacidade doada e impõe requisitos de uso. Um produto de produção deve usar um provedor, um serviço de tiles hospedado em conformidade ou infraestrutura auto-hospedada em vez de tratar o tile.openstreetmap.org como uma CDN comercial gratuita.
Para cada versão, verifique se a atribuição permanece visível e legível, o link de atribuição aponta para a licença ou página de direitos autorais necessária, qualquer conjunto de dados adicional ou créditos de imagens estão presentes, imagens de satélite e híbridas seguem suas licenças comerciais separadas e os termos de armazenamento, cache e redistribuição do provedor são respeitados. Atualmente, a Kaleidr afirma que suas peças de mapa base abertas baseadas em OpenStreetMap podem ser usadas comercialmente dentro do subsídio mensal de carga de mapa do plano. As imagens de satélite e híbridas são camadas licenciadas separadas e não estão incluídas na oferta de tiles abertos.
Como testar acessibilidade e desempenho?
Uma tela de mapa não deve ser o único lugar onde aparecem informações essenciais. Teste o contraste do rótulo sobre a terra, a água, estradas, edifícios e terrenos; contraste de sobreposição contra cada variante do mapa base; estados selecionados e não selecionados sem depender apenas da cor; visibilidade de rota e limite para deficiências comuns de visão de cores; acesso do teclado a controles e listas de resultados; equivalentes de leitor de tela para marcadores e recursos selecionados; etiquetas de atribuição e controle legíveis; e comportamento de movimento reduzido para transições de câmera, quando apropriado. Use capturas de tela reais em zooms representativos, porque as verificações de contraste de interface genéricas não capturam todos os fundos que um rótulo ou marcador podem cruzar.
Um estilo personalizado pode afetar o desempenho de inicialização e interação por meio do tamanho do estilo JSON, número de fontes, número e complexidade de camadas, solicitações de glifo e sprite, tamanho de tiles e comportamento de cache, terreno e renderização 3D, trabalho de colisão de etiquetas, sobreposições ao vivo ou frequentemente atualizadas e limitações da GPU do dispositivo. Tempo de medição até que o primeiro mapa útil apareça, tempo de carregamento de estilo, tiles com falha, glifo e solicitações de sprite, taxa de quadros durante pan, zoom, pitch e rotação, uso de memória em dispositivos móveis representativos, impacto de sobreposições ao vivo e uso de mapa-carga e tiles por sessão. Remova camadas ocultas ou redundantes em vez de assumir que o renderizador as torna livres.
Quais verificações de qualidade devem fazer parte do lançamento?
Teste o mapa base em toda a geografia, escala, tema e estado do produto antes de aprovar um lançamento. Um estilo não deve ser aprovado com base em uma atraente captura de tela da cidade.
| Dimensão de teste | Casos obrigatórios |
|---|---|
| Geografia | Denso urbano, suburbano, rural, costeiro, montanhoso, internacional |
| Zoom | Regional, cidade, bairro, rua, prédio |
| Tema | Luz, escuro, alto contraste, variante de campanha da marca |
| Estado de dados | Sem sobreposições, resultados normais, resultados densos, resultado selecionado, rota, alerta |
| Dispositivo | Desktop, tablet, celular low-end, display de alta densidade |
| Rede | Rasteira, lenta, intermitente, em cache, início a frio |
| Língua | Nomes de lugares longos, vários scripts, direito à esquerda, quando suportado |
| Acessibilidade | Teclado, leitor de tela, simulação de visão colorida, texto ampliado |
Os seguintes nomes de eventos são recomendações editoriais, em vez de reivindicações sobre eventos de Kaleidr Analytics emitidos automaticamente:
basemap_loaded
basemap_load_failed
basemap_style_selected
basemap_style_changed
basemap_theme_changed
basemap_tile_error
basemap_attribution_opened
map_overlay_added
map_overlay_toggled
map_3d_enabled
map_session_completed
As métricas úteis incluem o primeiro tempo útil do mapa, a taxa de carga de estilo bem-sucedida, a taxa de erro do bloco, o uso da carga de mapa, a taxa de quadros do renderizador, a duração da sessão, a taxa de interação de sobreposição, a taxa de resultado selecionada, a conclusão da rota ou o fluxo de trabalho, a frequência do interruptor do tema, a conversão por variante do mapa base e os incidentes de suporte relacionados à legibilidade do mapa. Não declare um mapa base bem sucedido porque parece distinto. Meça se os usuários encontram, interpretam e agem com base nas informações geográficas do produto de forma mais eficaz.
Quais erros as equipes devem evitar?
| Erro | O que acontece | Correção recomendada |
|---|---|---|
| Aplicando a cor da marca em todos os lugares | Colasses de hierarquia geográfica | Reserve a cor da marca forte para recursos selecionados e sobreposições de produtos |
| Stilling o mapa base antes de definir a tarefa | O mapa parece polido, mas não suporta o fluxo de trabalho | Comece com decisões do usuário e contexto geográfico necessário |
| Manter cada rótulo de ponto de interesse | Dados importantes do produto competem com rótulos não relacionados | Remover ou atrasar etiquetas de baixo valor por zoom e categoria |
| Usando uma fonte corporativa sem suporte a glifos | Os rótulos falham ou recuam de forma inconsistente | Confirme a hospedagem de glifos, a cobertura de caracteres e a compatibilidade do renderizador |
| Tratando ícones como decoração | Os símbolos tornam-se inconsistentes e ambíguos | Crie um sistema de sprite semântico com estados e equivalentes de texto |
| Adicionando 3D por padrão | Declínio de desempenho e legibilidade | Use terrenos e extrusões apenas quando explicam a estrutura relevante |
| Mistura de sobreposição e cores de mapa base | Estados selecionados ou alerta desaparecem | Mantenha tokens de referência e cores operacionais separados |
| Removendo atribuição | O mapa viola os requisitos de origem | Mantenha a atribuição legível vinculada à fonte e à licença necessárias |
| Usando servidores de tiles OSM públicos como uma CDN de produção | O uso pode violar a política ou ser bloqueado | Use um provedor compatível, peças hospedadas pela Kaleidr ou infraestrutura auto-hospedada |
| Substituindo um estilo de produção sem versionamento | As regressões visuais chegam aos usuários sem reverter | Versão lança e preservar um estilo anterior testado |
Lista de verificação final da implementação
- Tarefa do mapa do produto documentada
- mapa base, sobreposição, interação e camadas de interface separadas
- Hisquiarquia geográfica definida
- Desenho de tokens de design de mapa aprovados
- Classes rodoviárias testadas por zoom
- Hierrais de rótulos e halos testados
- Cobertura de Glyph confirmada
- Sistema de sprite e ícone documentado
- Cores de sobreposição de produtos mantidos distintos
- Terreno e 3D justificados pelo caso de uso
- Localizações globais representativas revisadas
- Variantes claras, escuras e de acessibilidade testadas
- OpenStreetMap e outras atribuições visíveis
- Termos do fornecedor de tiles confirmados
- Restrições de origem de chave publicáveis configuradas
- Âmbito de capacidade
mapsconfirmado - Embed ou caminho direto do MapLibre selecionado
- ID de estilo e versão de lançamento gravada
- Erro e carregamento de estados implementados
- Desempenho testado em hardware móvel
- Map-load e uso de tiles monitorados
- Estilo rollback preservado
Veredicto final
Um mapa base personalizado de marca deve fazer um mapa parecer nativo do produto, melhorando a hierarquia das informações que os usuários precisam. Cor, tipografia, rótulos, ícones, terreno e 3D são ferramentas de implementação – não o objetivo. O fluxo de trabalho mais forte começa com a tarefa do produto, separa a geografia de referência de sobreposições operacionais, define tokens de design reutilizáveis, testa vários locais e zooms, preserva a atribuição de origem e é implantado através de um estilo versionado e caminho de entrega de tiles.
O Kaleidr suporta dois modelos de implementação documentados: incorporar um mapa base projetado com o product="tile" ou carregar o JSON de estilo Kaleidr publicado diretamente em um mapa do MapLibre. Use a incorporação quando o mapa base pode possuir sua superfície e a velocidade de integração é importante. Use o caminho direto do MapLibre quando o aplicativo host precisar de controle de mapa completo e deve adicionar suas próprias fontes, camadas e interações.
Crie um mapa base no Kaleidr Studio
Crie estilos de mapa, rótulos, camadas, terrenos, edifícios 3D e predefinições reutilizáveis para uma experiência espacial de marca. Comece a partir da tarefa do produto, aplique tokens seletivamente e publique um estilo que você possa incorporar ou carregar no MapLibre.
Adicione o mapa base projetado ao seu produto
Revise a incorporação de tiles, o URL do estilo MapLibre, a chave do navegador, a restrição de origem, o uso e a documentação de versão CDN antes de selecionar o caminho de integração.
Leia a documentação do tiles de Kaleidr
Perguntas frequentes
O que é um mapa base personalizado de marca?
Um mapa base personalizado é um estilo de referência geográfica reutilizável cujas cores, tipografia, rótulos, ícones, estradas, superfícies e camadas contextuais são projetadas para se adequar ao sistema visual e à tarefa do usuário de um produto. O mapa base fornece contexto; as sobreposições de produtos carregam o assunto do aplicativo.
Um mapa base é o mesmo que os dados do meu aplicativo?
Não. Não. O mapa base fornece contexto geográfico, como estradas, água, edifícios e rótulos. Os dados do aplicativo representam as propriedades do produto, armazena, ativos, incidentes, rotas ou outro assunto e devem normalmente aparecer acima do mapa base.
Posso usar a fonte da minha marca em um mapa vetorial?
Somente quando o renderizador pode carregar recursos de glifo compatíveis para a fonte e intervalos de caracteres necessários. Confirme licenciamento, geração de glifos, hospedagem, cobertura de idioma e comportamento de fallback antes de escolher o tipo de letra.
Os mapas base da Kaleidr podem ser usados no MapLibre?
Sim. Sim. O Kaleiirr documenta o carregamento de um JSON de estilo Kaleidr publicado diretamente como o valor style ao criar um mapa do MapLibre. O aplicativo host, em seguida, adiciona suas próprias sobreposições e interações em cima desse estilo.
Posso incorporar um mapa base da Kaleidr sem gerenciar o MapLibre diretamente?
Sim. Sim. O Kaleidrd SDK documenta um elemento personalizado product="tile" e uma opção de montagem imperativa que incorpora um mapa base projetado por ID de estilo. A incorporação possui sua própria superfície de mapa e se comunica através da interface documentada.
Quais estilos de mapa base da Kaleidr estão documentados atualmente?
A documentação atual do desenvolvedor lista kaleidr-morning, kaleidr-afternoon, kaleidr-night, kaleidr-editorial e kaleidr-plain. Os estilos de estúdio específicos da organização podem publicar em identificadores adicionais.
Os tiles da Kaleidr exigem uma chave de API?
As incorporações de tiles do navegador usam uma chave Kaleidr publicável com a capacidade de mapas apropriada e restrições de origem permitidas. As chaves da API estão atualmente incluídas nos planos Pro e Enterprise.
Posso usar comercialmente os tiles de mapa base aberto da Kaleidr?
A página de preços atual da Kaleidr diz que o uso comercial é permitido dentro do subsídio mensal de carga de mapa. O uso de produção de volume mais alto está incluído no Pro e o Enterprise suporta volume personalizado por meio de uma CDN independente. As imagens de satélite e híbridas permanecem licenciadas separadamente.
Preciso atribuir o OpenStreetMap?
Sim. Sim. O OpenStreetMap requer atribuição ao OpenStreetMap e seus colaboradores. O Kaleidr também afirma que a atribuição é necessária onde quer que seus tiles abertos baseados no OpenStreetMap apareçam. Mantenha o crédito visível e vinculado às informações de direitos autorais ou licença.
Posso usar os servidores públicos de tiles do OpenStreetMap em um produto comercial?
Os dados do OpenStreetMap estão abertos, mas os servidores de tiles públicos da OpenStreetMap Foundation têm uma política de uso separada e capacidade doada limitada. Um aplicativo de produção deve usar um provedor de tiles complacente ou infraestrutura auto-hospedada, em vez de assumir o uso irrestrito da CDN.
Todo mapa de marca deve usar relevo e edifícios 3D?
Não. Não. Terreno e 3D devem ser usados quando melhoram a compreensão espacial. Eles podem reduzir a legibilidade e o desempenho quando não suportam a tarefa do usuário.
Como devo medir a eficácia do mapa base?
Meça a confiabilidade da carga de estilo, o primeiro tempo útil do mapa, os erros de azules, a interação de sobreposição, a seleção de resultados, a conclusão do fluxo de trabalho, os problemas de acessibilidade, os incidentes de suporte e a conversão. A distinção visual por si só não é uma medida de sucesso suficiente.
Referências
- Kaleidr. CDN versioning. Kaleidr Developer Docs. Accessed 25 July 2026. https://docs.kaleidr.com/reference/cdn-versioning
- Kaleidr. Create Custom Maps with AI Map Maker. kaleidr.com. Accessed 25 July 2026. https://kaleidr.com/studio
- Kaleidr. Get an API key. Kaleidr Developer Docs. Accessed 25 July 2026. https://docs.kaleidr.com/get-an-api-key
- Kaleidr. Introduction. Kaleidr Developer Docs. Accessed 25 July 2026. https://docs.kaleidr.com
- Kaleidr. Pricing & Plans. kaleidr.com. Accessed 25 July 2026. https://kaleidr.com/pricing
- Kaleidr. Tiles — embed a designed basemap. Kaleidr Developer Docs. Accessed 25 July 2026. https://docs.kaleidr.com/sdk/tiles
- Kaleidr. Use a designed basemap. Kaleidr Developer Docs. Accessed 25 July 2026. https://docs.kaleidr.com/guides/use-tiles
- MapLibre. Display buildings in 3D. MapLibre GL JS documentation. Accessed 25 July 2026. https://maplibre.org/maplibre-gl-js/docs/examples/display-buildings-in-3d/
- MapLibre. Glyphs. MapLibre Style Specification. Accessed 25 July 2026. https://maplibre.org/maplibre-style-spec/glyphs/
- MapLibre. Introduction. MapLibre Style Specification. Accessed 25 July 2026. https://maplibre.org/maplibre-style-spec/
- MapLibre. Layers. MapLibre Style Specification. Accessed 25 July 2026. https://maplibre.org/maplibre-style-spec/layers/
- MapLibre. Sources. MapLibre Style Specification. Accessed 25 July 2026. https://maplibre.org/maplibre-style-spec/sources/
- MapLibre. Sprite. MapLibre Style Specification. Accessed 25 July 2026. https://maplibre.org/maplibre-style-spec/sprite/
- MapLibre. 3D Terrain. MapLibre GL JS documentation. Accessed 25 July 2026. https://maplibre.org/maplibre-gl-js/docs/examples/3d-terrain/
- OpenStreetMap. Copyright and License. Accessed 25 July 2026. https://www.openstreetmap.org/copyright
- OpenStreetMap Foundation. Licence/Attribution Guidelines. Accessed 25 July 2026. https://osmfoundation.org/wiki/Licence/Attribution_Guidelines
- OpenStreetMap Foundation. Tile Usage Policy. Accessed 25 July 2026. https://operations.osmfoundation.org/policies/tiles/
- OpenStreetMap Foundation. Vector Tile Usage Policy. Accessed 25 July 2026. https://operations.osmfoundation.org/policies/vector/
@misc{kaleidr_tiles,
title = {Tiles --- embed a designed basemap},
author = {{Kaleidr}},
note = {Kaleidr Developer Docs; accessed 25 July 2026},
url = {https://docs.kaleidr.com/sdk/tiles}
}
@misc{kaleidr_use_tiles,
title = {Use a designed basemap},
author = {{Kaleidr}},
note = {Kaleidr Developer Docs; accessed 25 July 2026},
url = {https://docs.kaleidr.com/guides/use-tiles}
}
@misc{kaleidr_studio,
title = {Create Custom Maps with AI Map Maker},
author = {{Kaleidr}},
note = {Accessed 25 July 2026},
url = {https://kaleidr.com/studio}
}
@misc{maplibre_style_spec,
title = {MapLibre Style Specification},
author = {{MapLibre}},
note = {Accessed 25 July 2026},
url = {https://maplibre.org/maplibre-style-spec/}
}
@misc{osm_copyright,
title = {Copyright and License},
author = {{OpenStreetMap}},
note = {Accessed 25 July 2026},
url = {https://www.openstreetmap.org/copyright}
}
@misc{osm_tile_policy,
title = {Tile Usage Policy},
author = {{OpenStreetMap Foundation}},
note = {Accessed 25 July 2026},
url = {https://operations.osmfoundation.org/policies/tiles/}
}