Tutorial: Container com Aplicações de Gráfico

Neste exemplo utilizaremos 5 aplicações, 4 de Gráficos e 1 Container que exibirá os gráficos simultâneamente, como em uma dashboard.

Aqui podemos ver cada uma das aplicações de gráficos individualmente…





…e aqui, a aplicação final de Container exbindo os 4 gráficos.


Criando as aplicações de Gráficos

Gráfico de Área

1. Crie uma nova aplicação de Gráfico baseada na tabela city.


2. Acesse a opção “Gráficos” no menu da aplicação.


3. Em “Dimensões” selecionaremos o campo “stateid”.


4. Em “Métrica” selecionaremos “Quantidade de Registros”.


5. Em “Gráfico”, o tipo selecionado será “Area”.


6. Clique em “Executar aplicação” para gerar os fontes e visualizar a aplicação.


Gráfico de Pirâmide

7. Seguindo os passos utilizados para configurar a aplicação anterior, utilizaremos as seguintes configurações para o gráfico pirâmide:

  • Nova aplicação de gráfico baseada na tabela “orders”
  • No menu “Gráficos”, selecionaremos o campo “employeeid” no item “Dimensões”.
  • A “Métrica” será a “Quantidade de Registros”.
  • E o tipo selecionado em “Gráfico” será o “Pirâmide”.
  • Execute a aplicação

Gráfico de Gauge

8. Utilizaremos as seguintes configurações para o gráfico de Gauge:

  • Nova aplicação de gráfico baseada na tabela “customers”
  • No menu “Gráficos”, selecionaremos o campo “cardtype” no item “Dimensões”.
  • A “Métrica” será a “Quantidade de Registros”.
  • E o tipo selecionado em “Gráfico” será “Gauge”.
  • Execute a aplicação

Gráfico de Pizza

9. Utilizaremos as seguintes configurações para o gráfico de Pizza:

  • Nova aplicação de gráfico baseada na tabela “customers”
  • No menu “Gráficos”, selecionaremos o campo “regionid” no item “Dimensões”.
  • A “Métrica” será a “Quantidade de Registros”.
  • E o tipo selecionado em “Gráfico” será “Pizza”.
  • Execute a aplicação

Criando a aplicação de Container

10. Crie uma nova aplicação de Container


11. No menu de “Configurações” da aplicação, clique no botão para “Adicionar Coluna”


12. Em cada uma das colunas, adicione mais um widget.


13. Em cada um dos widgets utilizaremos uma altura de 500px e habilitaremos apenas a opção “Mover”. Coloque um título e associe a aplicação de gráfico para cada widget. Veja imagem abaixo.


Compartilhe este tutorial

Tutoriais na mesma categoria

Card View HTML (Formato Livre)

Neste exemplo, veremos o recurso do Scriptcase que permite utilizar templates HTML para visualizar ...

Colunas Fixas no Resumo

Neste exemplo, veremos a opção de fixar colunas no módulo de Resumo das aplicações de Consulta...

Salvando Visualizações de Relatório

Neste exemplo, veremos as opções disponíveis para o usuário final armazenar em sessão ou em ar...

Renomeando arquivos de exportação

Os arquivos resultantes das exportações realizadas na consulta, são armazenados no diretório&nb...

Comente este post