Parâmetros
editar- width: largura do gráfico;
- height: altura do gráfico;
- type: tipo de gráfico.:
line
para gráfico de linha,area
para de área erect
para gráfico de barras; - colors: cores das séries do gráfico, separadas por vírgula. Estas podem ser usadas em formato
#rgb
/#rrggbb
ou pelo nome CSS; - xAxisTitle e yAxisTitle: etiquetas para os eixos x e y;
- x: os valores de x em uma lista separada por vírgulas;
- y ou y1, y2, …: os valores de y para uma ou várias séries de dados, respectivamente;
- legend: título da legenda (somente funciona quando há várias séries de dados);
- y1Title, y2Title, …: define a etiqueta da respectiva série de dados na legenda;
- linewidth: espessura da linha para gráficos de linha ou distância entre os segmentos para os gráficos de pizza;
- showValues: Adicionalmente, mostra os valores de y como texto. (Atualmente, somente gráficos de barras e de pizza não empilhados são suportados) A saída pode ser configurada usando-se os seguintes parâmetros providos como name1:value1, name2:value2:
- fontcolor: cor do texto;
- fontsize: tamanho do texto
- innerRadius: Para gráficos de pizza: define o ráio interior para criar um gráfico de donut.
Nota: Na pré-visualização da edição, a extensão um elemento de tela com gráficos vetoriais. No entanto, ao salvar a página, os gráficos são rasterizados para um png.
Exemplos
editarGráfico de linha:
{{Gráfico|width=400|height=100|type=line|x=1,2,3,4,5,6,7,8|y=10,12,6,14,2,10,7,9|colors=#36c}}
14 7 0
|
1 4 8 |
|||||||||||||||||||||||||||
Nota: O eixo y começa do menor valor de y, apesar de isso poder ser substituído com o parâmetro yAxisMin
.
Gráfico de área:
{{Gráfico|width=400|height=100|type=area|x=1,2,3,4,5,6,7,8|y=10,12,6,14,2,10,7,9|colors=#36c}}
14 7 0
|
1 4 8 | ||||||||
Nota: o eixo y começa em 0
Gráfico de barra:
{{Gráfico|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|type=rect|x=1,2,3,4,5,6,7,8|y=10,12,6,14,2,10,7,9}}
Y
|
10 12 6 14 2 10 7 9 |
1 2 3 4 5 6 7 8 X
|
Gráfico de linha com mais de uma série de dados, usando cores:
{{Gráfico|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legenda|type=line|x=1,2,3,4,5,6,7,8|y1=10,12,6,14,2,10,7,9|y2=2,4,6,8,13,11,9,2|colors=#0000aa,#ff8000}}
Y
|
14 7 0
|
1 4 8 |
|||||||||||||||||||||||||||||||||
X
|
Gráfico de área com mais de uma série de dados mostrando uma sobreposição homogênea:
{{Gráfico|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legenda|type=area|x=1,2,3,4,5,6,7,8|y1=10,12,6,14,2,10,7,9|y2=2,4,6,8,13,11,9,2|colors=#0000aa,#ff8000}}
Y
|
14 7 0
|
1 4 8 | ||||||||||||||
X
|
Gráfico de área com valores de dados suavizados:
{{Gráfico|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legenda|type=stackedarea|x=1,2,3,4,5,6,7,8|y1=10,12,6,14,2,10,7,9|y2=2,4,6,8,13,11,9,2|interpolate=monotone|colors=seagreen, orchid}}
Y
|
14 7 0
|
1 4 8 | ||||||||||||||
X
|
Gráfico de barras com séries de dados empilhados:
{{Gráfico|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legenda|type=stackedrect|x=1,2,3,4,5,6,7,8|y1=10,12,6,14,2,10,7,9|y2=2,4,6,8,13,11,9,2|y1Title=Dados A|y2Title=Dados B|colors=seagreen, orchid}}
{{Gráfico|width=100|height=100|type=pie|legend=Legenda|x=A,B,C,D,E,F,G,H,I|y1=100,200,150,300,100,100,150,50,200}}
| ||||||||||||||||||||
{{Gráfico|width=100|height=100|type=pie|legend=Legenda|x=A,B,C,D,E,F,G,H,I|y1=100,200,150,300,100,100,150,50,200|showValues=}}
| ||||||||||||||||||||
{{Gráfico|width=100|height=100|type=pie|legend=Legenda|x=A,B,C,D,E,F,G,H,I|y1=100,200,150,300,100,100,150,50,200|y2=7,8,9,8,8,9,10,9,5|showValues=}}
| ||||||||||||||||||||
TemplateData
editarAdicione gráficos nas notícias
Parâmetro | Descrição | Tipo | Estado | |
---|---|---|---|---|
fontcolor | fontcolor | defina a cor do texto
| String | opcional |
fontsize | fontsize | defina o tamanho do texto
| String | opcional |
style | style | defina estilos adicionais
| String | opcional |
yAxisTitle | yAxisTitle | defina o significado dos valores de y | Linha | opcional |
type | type | defina qual o tipo do gráfico
| String | obrigatório |
y | y y1 | defina os números do gráfico, separados por vírgula. Você pode usar y2 e assim sucessivamente
| String | obrigatório |
height | height | defina a altura do gráfico
| String | obrigatório |
opacity | opacity | defina opacidade do gráfico (de 0–1) | String | opcional |
width | width | defina a largura do gráfico
| String | obrigatório |
x | x | defina uma associação aos números de "y"
| String | opcional |
colors | colors | defina cores para o gráfico, separadas por vírgula
| String | recomendado |
y1Title | y1Title | defina uma descrição ao y. Ao y2 use y2Title e assim sucessivamente | Linha | opcional |
xAxisTitle | xAxisTitle | defina o significado dos valores de x | Linha | opcional |