Componente Grafico
Weknow Client Desktop – Criação e Edição de Dashboards - Componente Grafico
Weknow Client Desktop – Criação e Edição de Dashboards - Componente Grafico
Para criação de um componente de tipo Gráfico, na última tela do assistente deste objeto deverá ser informado pelo menos um campo na área de Valores e Rótulos, além da escolha de um tipo de Gráfico em Série Base.
Para iniciar, bastar selecionar o campo na listagem do lado esquerdo e arrastar para as áreas Valores e Rótulos à direita (área central da tela):
A listagem à esquerda da tela são os Campos disponíveis, conforme disponibilizados pelo metadado informado na confecção do componente em fases anteriores. Se caso algum campo estiver faltando ou ainda não existir edite o seu metadado ou crie um campo calculado.
Para os campos em Rótulos é possível alterar sua formatação. Essa opção é uma funcionalidade genérica e possui mais informações no tópico Componentes - Opções Gerais deste mesmo documento.
Já para Valores, é possível alterar o título, a função de agregação (Soma, Média, Contagem, Máximo, Mínimo), sua formatação e o tipo da série que se baseará na opção Série base.
Por exemplo, caso selecionado na Série base a opção Pizza, o assistente permitirá que a série seja tanto em Pizza quanto em Rosca pois estes são tipos da mesma família de série base. A seguir temos as opções de Valores e das famílias de indicadores:
Sendo assim, ao clicar nas opções que constam em Série base, aparecerão os tipos de gráfico de acordo com sua familiaridade. Dentre eles, gráficos dos tipos: Coluna, Linha, Área, Pizza, Rosca, Barra, Bolha, Dispersão.
Além das opções apresentadas, há também a opção de remover o campo de valores através do símbolo X, a opção para limpar todos os valores com um símbolo de Vassoura e ainda a opção Configurações representada como uma pequena Engrenagem.
Com a opção Visões customizadas, no momento de editar o gráfico o desenvolvedor de conteúdo pode disponibilizar campos que farão o usuário final utilizar este gráfico com diversas novas visões e novas formas de análise em meio à sua utilização do gráfico em questão:
Ao entrar na versão Web será possível visualizar os dados disponível (selecionado nas visões customizadas do componente), conforme exemplo a seguir:
Ao clicar em Usar campo do metadado, irá abrir um menu suspenso para selecionar o campo que deseja utilizar:
No Weknow Desktop é possível criar diversas dimensões para o mesmo gráfico e está disponível na edição de um componente do tipo gráfico. Com está opção, no momento de editar o gráfico o desenvolvedor de conteúdo pode disponibilizar várias dimensões para o mesmo gráfico.
Ao clicar no botão irá abrir um menu suspenso:
O primeiro bloco de opções exibe as visões já cadastradas. A visão atualmente ativa é destacada em negrito. Além disso, a visão padrão (que é sempre a primeira da lista) é marcada com o texto adicional ‘(padrão)’.
A opção renomear esta visão permite que especifique o nome da visão atualmente ativa. Por padrão, o sistema monta o nome da visão de forma automática de acordo com os campos nela presentes.
A opção excluir esta visão permite que exclua a visão atualmente ativa. Está opção é visível apenas se houverem ao menos duas visões.
A opção alterar a ordem das visões permite que reorganize as visões. Ele pode, desta forma, definir a visão padrão colocando-a no topo da lista. Está opção é visível apenas se houverem ao menos duas visões.
A opção excluir todas as visões (exceto a padrão) permite que remova todas as visões adicionais. Está opção é visível apenas se houverem ao menos duas visões.
A opção adicionar visão permite que adicione uma nova visão.
A pré-visualização do assistente exibe automaticamente os dados de acordo com a(s) visão(ões) ativa(s).
No dashboard, o componente exibe textos adicionais quando há visões. Ao clicar nestes textos abre um menu suspenso que permite alterar a visão atualmente ativa:
Essa última opção abrirá uma janela de configurações estéticas.
Também é possível renomear o titulo do campo das visões pelo Weknow Desktop, mas para isso é necessário que o gráfico tenha pelo menos duas visões:
As configurações estéticas contam com diversos parâmetros como: texto de legendas; dica flutuante; formatação de cores condicionais/fixas; Texto Central (utilizado em gráfico Rosca) entre outras configurações, que além de estarem a disposição especificamente em cada série, podem ser disponibilizadas de forma genérica em Série (padrão):
Nesta sessão em Menu lateral >> Configuração >> Série (padrão), as configurações são aplicadas como um padrão para todos os campos selecionados em Valores, e caso algum dos valores tenham configurações informadas, estas então serão consideradas mais específicas e por isso então sobrepõe as configurações em Série (padrão).
Para o gráfico de Barras, por exemplo, é possível selecionar em qual eixo os valores para o campo vão se posicionar. Permitindo um gráfico de barras com dois eixos (esquerda e direita) e com número de Divisões diferentes, e até mesmo Barra de Rolagem. Basta configurar o campo para ter o seu Eixo vertical/horizontal diferente do padrão, conforme segue:
Ainda assim, as configurações estéticas podem ser alteradas mais uma vez em Personalizações. Essa opção é ainda mais específica, podendo ser aplicada a apenas uma parte do valor e não ao campo inteiro. Por isso sobrescreve todas as outras configurações estéticas já realizadas, sejam elas no padrão ou para um campo na opção da engrenagem.
Para isso, a personalização depende apenas da Condição (fórmula) para identificar quais valores são personalizados. Essa configuração utiliza do formulador do Weknow com diversas funções cada uma com sua descrição do valor retornado.
No exemplo a seguir a fórmula está buscando o valor do Rótulo - $label – e comparando com o valor “Feminino”. Se caso verdadeiro, a personalização é aplicada, caso contrário não.
Isso significa que essa personalização está sobrescrevendo a configuração padrão em todas as linhas que possuem o campo “person_sex” com o valor “Feminino”, aplicando a seguinte configuração:
O campo “person_sex” não possui seus valores como “Feminino” e “Masculino”, para isso foi utilizada a opção de Formatação. Mais detalhes desta opção estão em Componentes – Opções Gerais.
Nesse exemplo, com o modo Fixa selecionado, o Rótulo assume tom em Rosa caso se chame “Feminino”, e através de outra personalização, Azul caso denominado “Masculino”.
Se houver alguma configuração em Personalizações ou na Configuração do campo, como apresentado anteriormente, essas sobrescreverão a configuração feita em Série (padrão).
Outros modos para configuração das cores estão disponíveis como o modo Escala, é possível que se assumam cores de acordo com faixas percentuais dos valores assumidos de acordo com seu 100% de dados, ou ainda em faixas de valores reais. Exemplo:
“...” – Importa sequências de cores padrão da ferramenta, e que podem ser editadas para o gráfico em questão sem alterar o modelo de fábrica;
“+” – Insere nova faixa, onde então deverá ser editada a cor e Valor / Tipo associado;
“-” – Remove faixa de cor selecionada;
“x” – Limpa as configurações de cores desta regra de formatação condicional.
Ainda é possível configurar o comportamento de aplicação da escala através da opção Aplicação. Por exemplo, ao selecionar Mesclar cores, tendo duas cores num intervalo entre dois valores (0% a 100%) a formatação condicional analisa o peso do % de determinado valor ao seu total, e distribui esse peso de forma “dégradé” de cores:
É possível também definir mais intervalos/faixas de percentuais. Segue exemplo usando a escala de cores pré-definida “Warm” e sua sugestão inicial de cores e faixas, a partir do botão “...”:
No exemplo acima note que o rótulo com maior peso tem 22,01%, e por isto o Weknow pintou com a cor que se encaixa entre as faixas 86% e 100%.
Pode-se criar sequências a qualquer momento e necessidade, ou ainda excluir ou mudar as cores que foram sugeridas pela escala.
Outro exemplo de configuração estética é a Linha curvada de gráficos do tipo Linha e Área. Essa opção aparece apenas na visão do Web Client, porém pode ser aplicada na Série (padrão) como no exemplo a seguir:
Fazendo uso de todos os artifícios acima pode-se aplicar diversas configurações únicas para os componentes do tipo gráfico. A seguir está um exemplo em que utiliza de uma Personalização do tipo Escala para uma Série específica (grupo de dados) além de uma Formatação do campo “person_sex”:
Legendas do objeto Gráfico: A área de edição de LEGENDAS dos gráficos é disposta com opções intuitivas, no entanto seu editor de texto possibilita utilização de macros que preenchem automaticamente valores relacionados a Séries, Total e Linhas de Tendência:
Antes de aplicar estas macros, seguem alguns conceitos relacionados a estes termos que irão auxiliar ao entendimento para construção de textos de legenda com macros de forma mais prática:
Série: É um conjunto de pontos. Na imagem a seguir, as barras azuis são uma série e as barras roxas são outra série.
Rótulo: Também é um conjunto de pontos, e no exemplo a seguir vemos que um rótulo pode ser dividido entre séries agrupando informações. Veja que no exemplo, BA é um rótulo, GO é outro, MA é outro, e assim por diante. Cada rótulo do exemplo um possui dois pontos.
Ponto: É cada unidade desenhada individualmente (na imagem a seguir representado com barras).
Com base nestes conceitos, na imagem a seguir há: 2 séries; 14 rótulos; 28 pontos.
Configurações> Valores> Anexar:
As séries anexas são séries baseadas em uma série mestre, ou seja, elas usam os dados sumarizados de uma outra série para apresentar alguma informação adicional a respeito desta série como, por exemplo, a sua variação.
Na área CONFIGURAÇÃO, ao inserir um campo na área VALORES, temos um ícone com símbolo “+” Adicionar. Ao acioná-lo vemos as opções de anexar informações calculadas automaticamente levando em consideração o histórico exibido no gráfico na evolução de seus valores, e com isto podendo gerar diversas linhas de tendência, Média variável, Variação absoluta ou Variação Percentual para os valores da série em questão:
Dentre as opções mais utilizadas, destacamos a opção de Variação Percentual , Variação absoluta e Média variável:
Variação percentual: Apresenta a variação percentual dos dados da série mestre com base nos N rótulos anteriores (N >= 2):
Variação absoluta: Apresenta a variação absoluta dos dados da série mestre com base nos N rótulos anteriores (N >= 2):
Média variável: Apresenta a média variável dos dados da série mestre com base nos N rótulos anteriores (N >= 2).
Antes de citarmos as demais opções de séries anexas dos tipos Linhas de Tendência, vale ressaltarmos que estas linhas possuem em sua configuração a possibilidade de habilitar recuos ou avanços automáticos para os rótulos com valores que possuem séries com anexos.
Isto faz com que, caso a opção GERAL >> Estimar Rótulos esteja acionada, o gráfico incluirá automaticamente rótulos com informações prévias (recuo) aos rótulos vindos do metadado, ou novos rótulos com período futuro (avanço) com projeção de rótulo que não esteja no metadado, conforme informações de número de recuos ou avanços estejam citados nas configurações desta série:
Sobre as linhas de tendência disponíveis, a seguir são elencadas as descrições dos critérios matemáticos considerados para cada opção técnica disponibilizada:
Linha de tendência linear: Apresenta uma linha reta baseada na tendência apresentada pelos dados da série mestre. A fórmula que explica esta série é: y(x) = A + B*x. A e B são calculados de acordo com os dados da série mestre. O coeficiente de correlação R2 indica o quanto os dados condizem com esta linha de tendência. Há variáveis disponíveis para apresentar a fórmula e o coeficiente de correlação nos textos do gráfico. É possível indicar um recuo e/ou um avanço para estimar a tendência além dos rótulos disponíveis.
Linha de tendência exponencial: Apresenta uma linha exponencial baseada na tendência apresentada pelos dados da série mestre. A fórmula que explica esta série é: y(x) = A * eB*x. A e B são calculados de acordo com os dados da série mestre. O coeficiente de correlação R2 indica o quanto os dados condizem com esta linha de tendência. Há variáveis disponíveis para apresentar a fórmula e o coeficiente de correlação nos textos do gráfico. É possível indicar um recuo e/ou um avanço para estimar a tendência além dos rótulos disponíveis.
Linha de tendência logarítmica: Apresenta uma linha logarítmica baseada na tendência apresentada pelos dados da série mestre. A fórmula que explica esta série é: y(x) = A + B*ln(x). A e B são calculados de acordo com os dados da série mestre. O coeficiente de correlação R2 indica o quanto os dados condizem com esta linha de tendência. Há variáveis disponíveis para apresentar a fórmula e o coeficiente de correlação nos textos do gráfico. É possível indicar um avanço para estimar a tendência além dos rótulos disponíveis.
Linha de tendência quadrática: Apresenta uma linha quadrática baseada na tendência apresentada pelos dados da série mestre. A fórmula que explica esta série é: y(x) = A + B*x + C*x2. A e B são calculados de acordo com os dados da série mestre. O coeficiente de correlação R2 indica o quanto os dados condizem com esta linha de tendência. Há variáveis disponíveis para apresentar a fórmula e o coeficiente de correlação nos textos do gráfico. É possível indicar um recuo e/ou um avanço para estimar a tendência além dos rótulos disponíveis.
Linha de tendência potência: Apresenta uma linha potência baseada na tendência apresentada pelos dados da série mestre. A fórmula que explica esta série é: y(x) = A + xB. A e B são calculados de acordo com os dados da série mestre. O coeficiente de correlação R2 indica o quanto os dados condizem com esta linha de tendência. Há variáveis disponíveis para apresentar a fórmula e o coeficiente de correlação nos textos do gráfico. É possível indicar um recuo e/ou um avanço para estimar a tendência além dos rótulos disponíveis.
Total Acumulado Percentual: Apresenta o Total Acumulado Percentual com base na fórmula:
Onde:
S: valor absoluto do ponto na série mestre
T: total absoluto da série mestre
Vn-1: valor do ponto anterior
Exemplo:
Primeiro ponto: V1 = S / T + Vn-1 = 307 / 1000 + 0 = 30,7
Segundo ponto seria:
V2 = S / T + Vn-1 = 87 / 1000 + 30,7 = 8,7 + 30,7 = 39,4
Peculiaridades Gráfico Bolhas:
Diferente de outros gráficos que avaliam apenas a partir de um valor e sua agregação, e divisão entre rótulos e séries, o gráfico de bolhas solicita informar 3 tipos de valores e suas agregações. Primeiramente em valor principal incluiremos N valores a serem medidos, e na sequência, entre 2 eixos X e Y (Eixo X inferior e eixo Y Vertical) outros valores com agregações são utilizados como referência. Por esta razão, os campos inclusos em valores são distribuídos entre os Eixos X e Y, conforme campos e agregações que o registro com valores apresente, e agrupa as categorias de informações de acordo com os campos rótulos indicados para o gráfico em questão.
Exemplo: Média de valores unitários por categorias de materiais, de acordo com contagem de produtos em cada venda e a média dos valores unitários:
Peculiaridades Gráfico Dispersão:
Gráficos de dispersão solicitam informar 2 tipos de valores e suas agregações entre 2 eixos X e Y (Eixo X inferior e eixo Y Vertical). Estes valores identificam cada ponto individualmente em Rótulos, como podemos ver no texto da dica flutuante do exemplo a seguir. Já as séries identificam uma divisão de grupos destas informações, como uma espécie de agrupamento de informações deste conjunto de pontos.
Exemplo: Distribuição de população com análise de pontos de concentração de indivíduos (rótulo) e gêneros (séries) de acordo com cruzamento de altura e peso, para reconhecimento visual mais rápido de pontos que exijam cuidados por poderem estar fora de um conjunto de valores limite aceitáveis.