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.

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, precisa ser utilizado uma lista (conforme Figura 1.1)

Parâmetro 4

object

Personaliza o gráfico, adicionando animação, legenda, título e etc. Visualizar tópico Sobre o parâmetro opções.

Parâmetro 5

LegendaobjectPrecisa ser passado uma lista contendo a(s) legenda(s) da(s) respectiva(s) série(s).OpçõesobjectSérie(s) do gráfico

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 Added

Figura 1.1 - Função para o bloco


Image Added

Figura 1.2 - Gráfico renderizado no browserImage Removed

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.