Tire o máximo partido do livro de receitas de visualizações do Looker: personalização da formatação condicional em gráficos cartesianos

O realce visual dos valores que cumprem determinadas condições permite aos utilizadores identificar rapidamente as tendências dos dados. Este padrão é frequentemente designado por formatação condicional.

Por exemplo, esta visualização do exemplo Colorir os valores máximo, mínimo e percentil nesta página ajuda o utilizador a identificar rapidamente os meses com as vendas mais baixas e mais elevadas:

No Looker, pode usar opções incorporadas que se encontram nas definições de visualização de gráficos de texto e tabelas para aplicar formatação condicional a gráficos de texto e tabelas. Para gráficos cartesianos, pode usar o editor de configuração de gráficos para formatar condicionalmente os valores de dados.

No editor de configuração de gráficos, pode usar o atributo series formatters para aplicar formatação condicional a valores que cumprem critérios específicos. Seguem-se algumas das regras de formatação condicional que pode aplicar:

  • O valor é superior, inferior ou igual a um valor especificado.

    Por exemplo, para aplicar formatação condicional a valores numéricos superiores a 100, use select: 'value > 100'.

  • O valor é o valor mínimo ou máximo na série.

    Por exemplo, para aplicar formatação condicional ao valor máximo, use select: 'max'.

  • O valor está dentro de uma ordem percentual especificada.

    Por exemplo, para aplicar formatação condicional a valores no décimo percentil superior, use select: 'percent_rank >= 0.9'.

  • O valor do eixo X corresponde a um valor especificado.

    Por exemplo, para aplicar formatação condicional a séries em que o valor do eixo x é "Columbia", use select: name = Columbia.

Este livro de receitas oferece os seguintes tutoriais:

Colorir os valores máximo, mínimo e percentil

Pode usar os atributos select e style para especificar a cor dos valores de dados máximos e mínimos num gráfico cartesiano, bem como quaisquer valores que se enquadrem num percentil especificado.

Ingredientes

Pré-requisitos

A criação de uma visualização cartesiana com formatação condicional requer o seguinte:

Exemplo: visualização de colunas

Uma equipa de vendas quer poder identificar rapidamente as tendências de vendas mensais ao longo de um ano. Têm uma visualização que apresenta o Custo total agrupado por Mês.

Pode usar a formatação condicional para realçar valores que cumprem determinados objetivos, o que ajuda a tornar os dados mais claros para os utilizadores compreenderem.

Para este exemplo, a equipa de vendas quer realçar os seguintes valores:

  • A coluna com o valor Custo total mínimo é apresentada a vermelho.
  • A coluna com o valor Custo total máximo é apresentada a verde.
  • Todas as colunas no percentil 30 inferior do Custo total são apresentadas a laranja.
  • Todas as outras colunas são apresentadas a cinzento.

Para aplicar esta formatação condicional a um gráfico cartesiano, siga estes passos:

  1. Veja uma visualização cartesiana numa exploração ou edite uma visualização cartesiana num relatório detalhado ou num painel de controlo.
  2. Abra o menu Editar na visualização.
  3. Clique no botão Editar configuração do gráfico no separador Gráfico. O Looker apresenta a caixa de diálogo Editar configuração do gráfico.
  4. Selecione a secção Chart Config (Override) e introduza o seguinte JSON:

    {
      series: [{
        color: 'gray',
        formatters: [{
            select: 'max',
            style: {
              color: 'green',
            }
          },
          {
            select: 'percent_rank <= 0.3',
            style: {
              color: 'orange'
            }
          },
          {
            select: 'min',
            style: {
              color: 'red'
            }
          },
        ]
      }]
    }
    
  5. Para aplicar as alterações, clique em Aplicar.

Agora, a equipa de vendas pode ver rapidamente os meses com um desempenho inferior e investigar esses meses para determinar o que aconteceu.

Depois de personalizar a visualização, pode guardá-la. Se viu a visualização numa exploração, guarde a exploração. Se editou um Look ou um painel de controlo, clique em Guardar.

Exemplo: visualização de diagrama de dispersão

Para aplicar a formatação condicional a visualizações de dispersão, pode especificar uma cor para os atributos style.marker.fillColor e style.marker.lineColor em vez do atributo style.color.

O atributo lineColor define a cor do contorno de cada ponto no gráfico de dispersão. O atributo fillColor define a cor interior de cada ponto no gráfico de dispersão.

Pode modificar o exemplo anterior seguindo estes passos:

  1. Veja uma visualização de diagrama de dispersão numa exploração ou edite uma visualização de diagrama de dispersão num Look ou num painel de controlo.
  2. Abra o menu Editar na visualização.
  3. Clique no botão Editar configuração do gráfico no separador Gráfico. O Looker apresenta a caixa de diálogo Editar configuração do gráfico.
  4. Selecione a secção Chart Config (Override) e introduza o seguinte JSON:

    {
      series: [{
        color: 'gray',
        formatters: [{
            select: 'max',
            style: {
              marker: {
                fillColor: 'green',
                lineColor: 'green'
              }
            }
          },
          {
            select: 'percent_rank <= 0.3',
            style: {
              marker: {
                fillColor: 'orange',
                lineColor: 'orange'
              }
            }
          },
          {
            select: 'min',
            style: {
              marker: {
                fillColor: 'red',
                lineColor: 'red'
              }
            }
          }
        ]
      }]
    }
    
  5. Clique em Aplicar para aplicar as alterações.

Na visualização resultante, o valor mínimo, o valor máximo e os valores nos 30 por cento inferiores são coloridos de acordo com as regras de formatação.

Depois de personalizar a visualização, pode guardá-la. Se viu a visualização numa exploração, guarde a exploração. Se editou um Look ou um painel de controlo, clique em Guardar.

Combine condições de formatação condicional

Pode usar AND e OR no atributo select para combinar expressões lógicas em regras de formatação condicional.

Ingredientes

Pré-requisitos

A criação de uma visualização cartesiana com formatação condicional requer o seguinte:

Exemplo

Uma equipa de vendas quer poder identificar rapidamente os meses que cumprem determinados critérios. Têm uma visualização que apresenta o Custo total agrupado por Mês.

Pode usar a formatação condicional para realçar valores que cumprem determinados objetivos, o que ajuda a tornar os dados mais claros para os utilizadores compreenderem.

Para este exemplo, a equipa de vendas quer realçar os seguintes valores:

  • Todas as colunas com valores de Custo total entre 43 000 € e 45 000 € (inclusive) são roxas.
  • Todas as outras colunas são apresentadas a cinzento.

Para aplicar esta formatação condicional a um gráfico cartesiano, siga estes passos:

  1. Veja uma visualização cartesiana numa exploração ou edite uma visualização cartesiana num relatório detalhado ou num painel de controlo.
  2. Abra o menu Editar na visualização.
  3. Clique no botão Editar configuração do gráfico no separador Gráfico. O Looker apresenta a caixa de diálogo Editar configuração do gráfico.
  4. Selecione a secção Chart Config (Override) e introduza o seguinte JSON:

    {
      series: [{
        color: 'gray',
        formatters: [{
            select: 'value >= 43000 AND value <= 45000',
            style: {
              color: 'purple',
            }
          },
        ]
      }]
    }
    
  5. Para aplicar as alterações, clique em Aplicar.

Agora, a equipa de vendas pode ver rapidamente que a receita de março, abril e setembro está entre 43 000 e 45 000 € e tomar medidas adicionais para saber o que aconteceu nesses meses.

Depois de personalizar a visualização, pode guardá-la. Se viu a visualização numa exploração, guarde a exploração. Se editou um Look ou um painel de controlo, clique em Guardar.