Imagens e ícones

A camada Imagens / ícones coloca um marcador em cada longitude e latitude. O marcador é uma imagem armazenada nos seus dados, como URI de dados ou texto SVG, ou um texto curto ou um emoji desenhado sobre um selo.

Ícones SVG de formas e cores diferentes marcando cidades em um mapa da Europa
Um ícone SVG em cada local, obtido de uma coluna que contém texto SVG para cada linha
O Icon Map Lite não pode carregar imagens a partir de links

O Icon Map Lite não faz nenhuma solicitação de rede, por isso nunca baixa uma imagem. Um valor como https://example.com/icons/store.png não é desenhado, e a linha não aparece no mapa. Em vez disso, coloque a própria imagem nos seus dados:

  • uma URI de dados, como data:image/png;base64,iVBORw0...
  • texto SVG, como <svg xmlns="http://www.w3.org/2000/svg" ...>...</svg>
  • a palavra pin, para um alfinete de mapa integrado

Ou dispense as imagens e use Texto ou emoji. Consulte De onde vem a imagem.

O que é necessário

Poço de campos O que colocar nele
* ID (obrigatório) Um valor exclusivo para cada linha
Longitude (X) Longitude em graus decimais, resumida como Média
Latitude (Y) Latitude em graus decimais, resumida como Média
Imagem / WKT / GeoJSON A imagem de cada linha: uma URI de dados, texto SVG ou pin. Dispensável quando Fonte da imagem é Texto ou emoji.

Estes campos devem estar vazios nas linhas de uma imagem: Tamanho do círculo, Longitude de destino, Latitude de destino, Referência da feição, Peso do mapa de calor e Peso da célula (H3/S2/A5/Geohash).

Remova o Tamanho do círculo

Uma linha com valor em Tamanho do círculo é um círculo, não uma imagem. Se você começou com círculos, tire o campo de Tamanho do círculo, ou as imagens não aparecerão.

Adicionar imagens ao mapa

  1. Adicione campos a * ID (obrigatório), Longitude (X) e Latitude (Y). Defina as coordenadas como Média.
  2. Se os seus dados contêm uma imagem para cada linha, como URI de dados ou texto SVG, adicione esse campo a Imagem / WKT / GeoJSON. Se você quer marcadores de texto ou emoji, deixe esse poço de campos vazio.
  3. Se o painel Que tipo de mapa quer criar? estiver visível, selecione o bloco Imagens e ícones. Caso contrário, no painel Formato expanda Camadas de dados e ative Imagens / ícones.
  4. Expanda Imagens - configuração e escolha uma Fonte da imagem: Imagem a partir dos dados ou Texto ou emoji.
  5. Defina o tamanho: Largura da imagem e Altura da imagem para imagens, ou Tamanho do ícone para texto e emoji.

De onde vem a imagem

Fonte da imagem tem duas opções.

Fonte da imagem O que é cada marcador Usa o campo Imagem / WKT / GeoJSON
Imagem a partir dos dados (o padrão) A imagem contida no valor de Imagem / WKT / GeoJSON da linha Sim
Texto ou emoji O texto da configuração Texto ou emoji, desenhado sobre um selo Não

Imagem a partir dos dados

Cada linha traz a sua própria imagem no campo Imagem / WKT / GeoJSON. O valor precisa ser um destes:

Valor Exemplo Desenhado
Uma URI de dados de uma imagem (PNG, JPEG, GIF, WebP ou SVG) data:image/png;base64,iVBORw0... Sim
Texto SVG <svg xmlns="http://www.w3.org/2000/svg" ...>...</svg> Sim
A palavra pin pin Sim, como alfinete de mapa integrado
Um link https://example.com/icons/store.png Não
Qualquer outro texto store Não
Diagrama: URIs de dados, texto SVG e a palavra pin são desenhados; links e outros textos não
O que Imagem a partir dos dados aceita

O valor precisa começar com data:image, <svg ou <?xml, ou ser exatamente pin, sem nada antes. Uma linha cujo valor seja qualquer outra coisa, incluindo um link, não é desenhada. Como a linha tem coordenadas, ela também não é uma forma, portanto não chega a nenhuma camada.

Como colocar as imagens nos seus dados:

  • Texto SVG em uma coluna ou medida. SVG é texto simples, por isso você pode armazená-lo em uma coluna ou montá-lo em uma medida DAX. Inclua xmlns="http://www.w3.org/2000/svg" na tag <svg>. Uma medida pode mudar o SVG por linha, por exemplo para colorir um ícone pelo status:

    Status Icon =
    "<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'>"
        & "<circle cx='12' cy='12' r='10' fill='" & [Status Color] & "'/></svg>"
    
  • URIs de dados. Converta cada arquivo de imagem em uma URI de dados com qualquer ferramenta de conversão de imagem para URI de dados e armazene o resultado em uma coluna. Mantenha as imagens pequenas: o Power BI armazena no máximo 32.766 caracteres em um único valor de texto, e uma URI de dados mais longa é cortada e não pode ser desenhada.

Texto ou emoji

Defina Fonte da imagem como Texto ou emoji e digite o texto, um símbolo ou um emoji na configuração Texto ou emoji. Cada local recebe esse texto, desenhado sobre um selo arredondado. O padrão é ▲. As linhas não precisam de nada em Imagem / WKT / GeoJSON.

Para mostrar um texto diferente em cada linha, selecione o botão fx ao lado de Texto ou emoji, escolha Valor do campo e selecione uma coluna que contenha o texto ou o emoji de cada linha. Consulte Formatação condicional.

  • O selo tem a altura de Tamanho do ícone e a largura de que o texto precisa.
  • Cor do ícone / do fundo e Transparência do fundo do ícone definem o selo.
  • Cor do texto do ícone define o texto.

Você também pode definir a cor do texto no próprio valor, com um prefixo:

Valor Resultado
Hello ou text:Hello "Hello" na Cor do texto do ícone
text-red:Hello "Hello" em vermelho
text-#884455:Hello "Hello" na cor #884455

As cores com nome são white, black, red, amber, orange, yellow, green, blue e gray.

Selos de emoji de vários tipos em locais do mapa
Texto ou emoji, com um emoji diferente para cada linha definido por formatação condicional

Não há biblioteca de ícones no Icon Map Lite. Um texto que pareça o nome de um ícone, como material-design-icons/filled/home, é desenhado como esse texto. Use um emoji, um caractere de símbolo ou um SVG.

Se você mantiver um campo em Imagem / WKT / GeoJSON enquanto usa Texto ou emoji, deixe-o em branco nas linhas de imagem. Uma linha cujo valor ali não seja uma imagem não é desenhada.

Configurações

Todas ficam em Painel Formato > Camadas de dados > Imagens - configuração, mostradas quando o botão de alternância Imagens / ícones está ativado.

Configuração O que faz Padrão fx
Fonte da imagem Texto ou emoji ou Imagem a partir dos dados. Veja acima. Imagem a partir dos dados
Texto ou emoji O texto ou o emoji desenhado em cada selo. Aparece com Texto ou emoji. ▲ Sim
Usar a cor do cluster Com Imagens do cluster ativada e um campo em Grupo do cluster, cada selo recebe a cor do seu grupo do cluster. Aparece com Texto ou emoji. Desativado
Cor do texto do ícone Cor do texto de um selo. Aparece com Texto ou emoji. #FFFFFF Sim
Cor do ícone / do fundo Cor de fundo de um selo. Aparece com Texto ou emoji. #000000 Sim
Transparência do fundo do ícone Transparência do fundo de um selo. Aparece com Texto ou emoji. 0 Sim
Rotação da imagem Gira o marcador no sentido horário, em graus, de 0 a 360. Chama-se Rotação do ícone com Texto ou emoji. Use fx para apontar cada marcador na sua própria direção, por exemplo o rumo de um veículo. 0 Sim
Alinhamento da rotação Viewport mantém os marcadores fixos em relação à tela quando o mapa gira. Mapa os gira junto com o mapa. Viewport
Alinhamento de inclinação Viewport mantém os marcadores de pé quando o mapa é inclinado. Mapa os deita sobre o mapa. Viewport
Largura da imagem Largura em pixels, de 0 a 1000. Chama-se Tamanho do ícone com Texto ou emoji, em que define a altura do selo. 30 Sim
Altura da imagem Altura em pixels, de 0 a 1000. Aparece com Imagem a partir dos dados. 30 Sim
Transparência 0 é opaco, 100 é invisível. 0 Sim
Deslocar imagens sobrepostas Os marcadores no mesmo local são dispostos lado a lado em vez de uns sobre os outros. Desativado
Espaçamento do deslocamento (pixels) Espaço entre os marcadores deslocados. De 0 a 100. 2
Tolerância de deslocamento (metros) A que distância os marcadores precisam estar para contar como o mesmo local. 0 significa exatamente as mesmas coordenadas. Até 10000. 0
Imagens do cluster Agrupa marcadores próximos em clusters. As configurações de cluster ficam no grupo Cluster - configuração do mesmo cartão. Consulte Clusters. Desativado
Incluir no zoom automático Se um marcador conta para a área para a qual o mapa aplica zoom. Sim Sim
Incluir dica de ferramenta Se um marcador mostra uma dica de ferramenta. Sim Sim
Selecionável Se um marcador pode ser selecionado. Sim Sim
Zoom mínimo Os marcadores ficam ocultos quando o mapa é afastado além deste nível. De -20 a 24. 0
Zoom máximo Os marcadores ficam ocultos quando o mapa é aproximado além deste nível. De -20 a 24. 24
EPSG Sistema de coordenadas da sua longitude e latitude. 4326

Deslocar imagens sobrepostas

Quando várias linhas compartilham um local, por exemplo três ativos em um mesmo endereço, os marcadores ficam exatamente uns sobre os outros. Ative Deslocar imagens sobrepostas para dispô-los em uma fileira horizontal centrada no local, separados por Espaçamento do deslocamento (pixels). Aumente Tolerância de deslocamento (metros) para tratar os marcadores dentro dessa distância como estando no mesmo lugar. Os deslocamentos se aplicam aos marcadores que não estão em um cluster.

Seleção, dicas de ferramenta e rótulos

  • Seleção. Selecione um marcador para filtrar os outros visuais da página do relatório, como faz uma segmentação de dados. Mantenha Ctrl ou Shift pressionada para selecionar vários. Os marcadores que você não selecionou esmaecem, usando Painel Formato > Seleção > Formatação > Transparência dos itens não selecionados. Consulte Selecionar e filtrar com o mapa.
  • Dicas de ferramenta. Sem campos em Dicas de ferramenta, a dica de ferramenta mostra o ID. Adicione campos a Dicas de ferramenta para mostrar esses campos no lugar do ID. Consulte Dicas de ferramenta.
  • Rótulos. Os marcadores podem ter rótulos de dados. Consulte Rótulos de dados.
  • Legenda. As imagens aparecem na legenda como Icons. Consulte Legenda.

Dicas e limites

  • Não aparece nada? Verifique os primeiros caracteres de um valor em Imagem / WKT / GeoJSON. Um link, um nome de arquivo ou um texto com um espaço antes de <svg não é desenhado. Verifique também se Tamanho do círculo está vazio nessas linhas.
  • Uma imagem é ancorada pelo centro. Para um alfinete cuja ponta deva tocar o local, use uma imagem com espaço vazio abaixo da ponta, de modo que a ponta fique no centro.
  • Os marcadores nunca ocultam uns aos outros. Onde se sobrepõem, todos são desenhados.
  • Imagens e círculos compartilham uma única posição na ordem de desenho, definida pelo Z Index de Círculos.
  • Os selos de texto e as imagens que se repetem são desenhados uma vez e reutilizados, por isso poucos valores diferentes em muitas linhas continuam rápidos. Milhares de imagens diferentes são mais lentas: prefira poucas imagens pequenas, ou selos de texto coloridos com fx.

Relacionados