Configuração Personalizada do Mapa

O alinhamento, a escala e a imagem de fundo podem ser configurados de forma independente para cada mapa guardado no dispositivo.

Estas definições podem ser configuradas no editor visual selecionando um mapa da lista de mapas, ou utilizando a propriedade map_config na configuração YAML.

Opções de Configuração de Mapas

As definições dentro de map_config são aplicadas por índice de mapa usando chaves como map_1, map_2, etc. Qualquer uma das seguintes opções pode ser definida sob um mapa específico:

Aviso

Os índices dos mapas são atribuídos com base na ordem de criação, sendo o mapa mais antigo atribuído ao índice mais baixo, começando em 1. No entanto, se a funcionalidade de mapas multi-piso estiver desativada num dispositivo que possui múltiplos mapas e as suas configurações, o mapa atualmente ativo é automaticamente reassigned ao índice 1. Isto significa que um mapa previamente configurado com um índice diferente adotará repentinamente a configuração de map_1.

• rotation: Substitui a rotação configurada nos dados do mapa para desenhar o mapa numa rotação personalizada específica deste cartão, aceitando valores de 0, 90, 180 ou 270.
• scale: Substitui o cálculo automático da escala com base na diferença entre o tamanho original do mapa e o tamanho do cartão, aceitando valores entre 0.1 e 20.
• object_scale: Substitui o tamanho automaticamente calculado dos objetos do mapa, como ícones de salas e obstáculos, permitindo que apareçam maiores ou menores.
• opacity: Transparência global do mapa desenhado. O valor inicial é 1 e aceita valores até 0.
• object_opacity: Transparência dos objetos desenhados no mapa, como ícones de salas ou obstáculos. O valor inicial é 1 e aceita valores até 0.
• font_size: Tamanho da fonte para balões de texto exibidos sobre objetos ativados. Aceita valores entre 0 e 12.
• hidden_objects: Substitui os objetos de mapa ocultos definidos no Configuração Avançada global para este mapa específico.

Centralização e Escala

Os parâmetros abaixo são usados para substituir o tamanho e as coordenadas centrais que o cartão calcula automaticamente para desenhar o mapa.

Aviso

Os valores fornecidos para estes parâmetros são relativos às dimensões brutas e não escaladas do mapa, e não aos pixels absolutos no ecrã. Como calcular estas coordenadas relativas manualmente é altamente complexo, os valores exatos necessários podem ser extraídos utilizando a secção Informação do Mapa em Tempo Real do editor visual.

• left: Substitui o centro horizontal do mapa calculado automaticamente. Por exemplo, definir este valor para 0 coloca a coordenada 0 do mapa no eixo X exatamente no centro horizontal do cartão. Este ponto normalmente está localizado mesmo à frente do cais.
• top: Substitui o centro vertical do mapa calculado automaticamente. Por exemplo, definir este valor para 0 coloca a coordenada 0 do mapa no eixo Y exatamente no centro vertical do cartão. Este ponto normalmente está localizado mesmo à frente do cais.
• width: Substitui a largura real do mapa usada para o cálculo de ajuste. Como a carta dimensiona o mapa com base na maior dimensão que se ajusta, inserir um valor maior que a largura real do mapa reduzirá o mapa dentro da carta, enquanto um valor menor irá ampliá-lo.
• height: Substitui a altura real do mapa usada para o cálculo de ajuste. Semelhante à propriedade width, inserir um valor maior que a altura real do mapa reduzirá o mapa dentro da carta, enquanto um valor menor irá ampliá-lo.

Exemplo YAML

type: custom:dreame-vacuum-card
entity: vacuum.l10s_gen2
map_config:
  map_1:
    rotation: 90
    scale: 1.2
    object_scale: 1.5
    left: 10
    top: -20
    hidden_objects:
      - name
      - virtual_wall
  map_2:
    rotation: 180
    opacity: 0.8

Imagens de Fundo e Sobreposição

A carta suporta a renderização de uma imagem de fundo personalizada atrás do mapa, o que é particularmente útil para criar dashboards imersivos de plantas 3D. Este comportamento é configurado usando a propriedade background_image.

Para melhorar ainda mais o efeito 3D, também pode ser fornecido um overlay_image opcional. A imagem sobreposta é desenhada diretamente sobre o percurso de limpeza do robô e o seu principal objetivo é ocultar visualmente os percursos que passam por trás de paredes físicas ou móveis no plano da casa. Recomenda-se vivamente a combinação de uma imagem de fundo e de uma imagem sobreposta para obter uma sensação realista de profundidade em painéis 3D.

Desenhando um Plano 3D

Ao criar gráficos personalizados para um plano 3D, o design deve ser exportado como duas imagens separadas com fundos transparentes: uma camada base contendo os pisos e móveis baixos e uma camada superior contendo apenas as paredes superiores.

As imagens de exemplo abaixo, mostradas sobre um padrão de tabuleiro de xadrez para destacar as suas áreas transparentes, foram geradas utilizando a aplicação gratuita de design de interiores Sweet Home 3D e posteriormente processadas em software de edição de imagens padrão para remover as áreas do chão e criar as partes transparentes necessárias.

Imagem de fundo

Imagem sobreposta

O background_image e o overlay_image suportam as seguintes propriedades para alinhar a planta:

• url: Caminho da imagem, tal como /local/first_floor_bg.
• opacity: Transparência da imagem. O valor inicial é 1 e aceita valores até 0.

Centralizar e Redimensionar Imagens

As propriedades left, top, width e height para imagens operam utilizando a mesma lógica de coordenadas relativas que a própria configuração Centralização e Escala do mapa. Estas propriedades são completamente opcionais.

Mesmo que a imagem personalizada corresponda perfeitamente ao tamanho do mapa, é fortemente recomendado fornecer pelo menos os valores de top e left. Isto garante que, se o tamanho total do mapa mudar no futuro, a imagem personalizada permaneça firmemente ancorada à mesma localização relativa.

Valores Predefinidos

Quando estes valores não são fornecidos, o cartão iguala automaticamente o tamanho e o centro da imagem personalizada com os dados do mapa. Estas propriedades são totalmente opcionais e existem unicamente para substituir este comportamento, evitando que a imagem personalizada se desloque ou que a sua escala mude no caso de o mapa expandir ou contrair ao longo do tempo.

• left: Define o centro horizontal da imagem em relação ao centro do mapa. Por exemplo, definir este valor para 0 coloca a coordenada 0 do mapa no eixo X exatamente no centro horizontal da imagem. Este ponto geralmente encontra-se mesmo à frente do cais.
• top: Define o centro vertical da imagem em relação ao centro do mapa. Por exemplo, definir este valor para 0 coloca a coordenada 0 do mapa no eixo Y exatamente no centro vertical da imagem. Este ponto geralmente encontra-se mesmo à frente do cais.
• width: Define a largura da imagem em relação ao sistema de coordenadas original e não escalado do mapa, em vez de pixels absolutos do ecrã. Por exemplo, definir este valor para corresponder à largura bruta do mapa garante que a imagem é dimensionada proporcionalmente para cobrir exatamente a mesma área horizontal que os dados do mapa.
• height: Define a altura da imagem em relação ao sistema de coordenadas original e não escalado do mapa. Por exemplo, definir este valor para corresponder à altura bruta do mapa garante que a imagem é dimensionada proporcionalmente para cobrir exatamente a mesma área vertical que os dados do mapa.

Rotação Nativa

Imagens personalizadas não possuem uma propriedade de rotação independente; a sua rotação está intrinsecamente ligada à rotação do mapa. Para garantir o alinhamento em todas as visualizações, a orientação base da imagem projetada deve corresponder exatamente à orientação inicial do mapa quando definida para 0 graus.

Relação de Pixels do Dispositivo (DPR)

O cartão renderiza o mapa de acordo com a proporção de pixels do ecrã do dispositivo. Para evitar que as imagens de fundo e sobreposição apareçam desfocadas em ecrãs de alta resolução, como telemóveis, é altamente recomendado fornecer estas imagens com, no mínimo, o dobro do tamanho necessário no painel de controlo de ambiente de trabalho.

Determinar o Tamanho da Imagem

Os dados do mapa incluem uma propriedade grid_size que indica quantos milímetros um único pixel representa no mundo real. Este valor pode ser encontrado na secção Informação do Mapa em Tempo Real. Por exemplo, um grid_size de 50 significa que cada pixel corresponde a 50mm, ou 5cm. Dividindo as dimensões do mundo real da casa por este grid_size, os valores exatos de width e height a introduzir na configuração podem ser calculados com precisão, garantindo que uma imagem da planta da casa em escala 1:1 se ajusta perfeitamente ao tamanho real da casa.

Exemplo YAML

type: custom:dreame-vacuum-card
entity: vacuum.l10s_gen2

map_config:
  map_1:
    object_scale: 7
    width: 250
    height: 183
    opacity: 0.45
    hidden_objects:
      - customized_cleaning
      - floor
      - name
      - name_background
      - no_go
      - no_mop
      - order
      - walls
    background_image:
      url: /local/home.png
      left: 77
      top: 10.3
      width: 250
      height: 183
      opacity: 0.75
    overlay_image:
      url: /local/home_overlay.png
      opacity: 0.9
  map_2:
    left: 41
    top: -12
    width: 269
    height: 171
    background_image:
      url: /local/second_floor_bg.png