Template:Grafico Vega 2

Istruzioni per l'uso
Le istruzioni che seguono sono contenute nella sottopagina Template:Grafico Vega 2/man (modifica · cronologia)
Sandbox: Template:Grafico Vega 2/Sandbox (modifica · cronologia) · Tutte le sottopagine: lista

---

Questo template serve a creare grafici con la versione 2 di Vega.

Parametri

Tutti i valori decimali devono essere inseriti con un punto al posto della virgola. width larghezza del grafico height altezza del grafico type tipo di grafico: line per un grafico a linee area per un grafico ad area rect per un istogramma pie per un grafico a torta. Più serie possono essere sovrapposte usando il prefisso stacked, ad esempio stackedarea. interpolate metodo di interpolazione per grafici a linea e ad area. Si raccomanda l'uso di monotone per una interpolazione cubica monotona – altri valori supportati sono elencati qui colors elenco separato da virgole con i colori delle serie del grafico. Il colore può essere indicato come #rgb, #rrggbb, #aarrggbb o dal nome del colore CSS. Per #aarrggbb la componente aa indica il canale alfa, cioè FF = opacità al 100%, 80 = opacità al 50%. xAxisTitle, yAxisTitle titoli degli assi x e y xAxisMin, xAxisMax, yAxisMin, yAxisMax valore minimo e massimo degli assi x e y (non supportato per gli istogrammi) xAxisFormat, yAxisFormat formati delle etichette degli assi. I valori supportati sono elencati qui per i numeri e qui per data/ora. Ad esempio, il formato % può essere utilizzato per le percentuali. xType, yType tipo di dati, ad esempio integer per gli interi, number per numeri reali, date per date (AAAA/MM/GG) e string per valori ordinali. x valori dell'asse x come elenco separato da virgole y, y1, y2, ... valori y come elenco separato da virgole per una o più serie di dati. For pie charts y2 denotes the radiuses of the corresponding sectors. legend mostra la legenda (solo in caso di più serie di dati) y1Title, y2Title, ... definisce l'etichetta per ogni serie di dati da mostrare nella legenda linewidth per grafici a linee indica lo spessore della linea; per grafici a torta indica la distanza tra i settori del grafico showValues mostra i valori y come testo (solo istogrammi (non sovrapposti) e grafici a torta). showSymbols solo per i grafici a linee mostra un cerchio per ogni dato innerRadius solo per i grafici a torta definisce il raggio interno per creare un grafico a ciambella

(legenda colori)

{{Grafico Vega 2
|width =
|height =
|type =
|interpolate =
|colors =
|xAxisTitle =
|yAxisTitle =
|xAxisMin =
|xAxisMax =
|yAxisMin =
|yAxisMax =
|xAxisFormat =
|yAxisFormat =
|xType =
|yType =
|x =
|y =
|yN =
|legend =
|yNTitle =
|linewidth =
|showValues =
|showSymbols =
|innerRadius =
}}

Esempi d'uso

Grafico a linee

{{Grafico Vega 2|width=400|height=100|type=line|x=1,2,3,4,5,6,7,8|y=10,12,6,14,2,10,7,9}}

Nota: L'asse y inizia dal valore più piccolo di y, ma può essere modificato tramite il parametro yAxisMin.

Graficoa ad area

{{Grafico Vega 2|width=400|height=100|type=area|x=1,2,3,4,5,6,7,8|y=10,12,6,14,2,10,7,9}}

Nota: L'asse y inizia da zero.

Istogramma

{{Grafico Vega 2|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}}

Grafico a linee con più di una serie con indicazione dei colori

{{Grafico Vega 2|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legend|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}}

Grafico ad area con più di una serie

{{Grafico Vega 2|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legend|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=#800000aa,#80ff8000}}

Istogramma con più serie

{{Grafico Vega 2|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legend|type=rect|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=#800000aa,#80ff8000}}

Grafico ad area con valori arrotondati

{{Grafico Vega 2|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legend|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}}

Istogramma con valori sovrapposti

{{Grafico Vega 2|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|legend=Legend|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=Data A|y2Title=Data B|colors=seagreen, orchid}}

{{Grafico Vega 2|width=100|height=100|type=pie|legend=Legende|x=A,B,C,D,E,F,G,H,I|y1=100,200,150,300,100,100,150,50,200}}

{{Grafico Vega 2|width=100|height=100|type=pie|legend=Legende|x=A,B,C,D,E,F,G,H,I|y1=100,200,150,300,100,100,150,50,200|showValues=}}

{{Grafico Vega 2|width=100|height=100|type=pie|legend=Legende|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=}}

{{Grafico Vega 2|width=100|height=100|type=pie|innerRadius=40|legend=Legende|x=A,B,C,D,E,F,G,H,I|y1=100,200,150,300,100,100,150,50,200}}