Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Criar gráfico

Cria um gráfico, definindo a série, legenda, nome da série, etc e o renderiza no formulário através do componente gráficocomponente visual Gráfico.

Parâmetros

de Entrada

Nome

Tipo

Doc

ID do gráfico

Parâmetro 1

string

Identificador do gráfico do componente visual.

Tipo de gráfico

Atributo Identificador contido na tag HTML <canvas> do componente visual Gráfico.

Parâmetro 2

string

Lista de

Seleção do tipo de gráfico

que pode ser criado.Legenda

a ser exibido (Tópico Tipos de gráficos).

Parâmetro 3

object

Informa o rótulo da série do gráfico. Caso seja mais de um

rôtulo

rótulo, precisa ser utilizado uma lista (conforme Figura 1.1)

Opções

Parâmetro 4

object

Personaliza o gráfico,

podendo ser uma

adicionando animação, legenda, título e etc.

Série(s) do gráfico

Visualizar tópico Sobre o parâmetro opções.

Parâmetro 5

object

Cria a(s) série(s) do gráfico através do

blockly criar

bloco de programação Criar série.

Compatibilidade

Image Added Servidor

Tipos de gráfico

As opções de gráfico disponíveis no bloco são:

Linha
(line)

Image Modified

Barra

Rosca

(bar)

Image Removed

Image Added

Barra horizontal
Image Removed
(horizontalBar)
Pizza

Image Added

Image Removed

Barra horizontal

Image Removed

Área polar

Image Removed

Compatibilidade

Image Removed Servidor

Image Removed Cliente
Rosca
(doughnut)

Image Added

Pizza
(pie)

Image Added

Área polar

Image Added

Exemplo de utilização

A função abaixo cria um gráfico no qual apresenta dados para os meses julhoagosto setembro. Esses dados são as quantidades de uma venda hipotética de chocolate e de jujuba.


Image RemovedImage Added

Figura 1.1 - Função para o bloco


Image Modified

Figura 1.2 - Gráfico renderizado no browser

Sobre o bloco

A adição de uma nova série para o bloco criar gráfico pode ser feita clicando-se no botão de configuração do bloco de programação. Assim, basta arrastar o item até o container contêiner - e verifique o local que ele vai ser arrastadoserá encaixado, pois a ordem é alteradopode ser alterada.


Image Modified

Figura 1.3 - Adicionando novos parâmetros de série

Sobre o parâmetro opções

Esse parâmetro define algumas propriedades ao gráfico, como adicionar título, definir animações no gráfico, alterar o layout e entre outros e podem criar personalizações para cada uma dessas propriedades, de acordo com as opções disponibilizadas nos links abaixo.

AnimaçãoLayoutLegendaTítuloTooltip e Elementos.