Mashup Builder > Widget > Widget standard > Widget Grafico combinato (con tema applicabile)
Widget Grafico combinato (con tema applicabile)
Panoramica
Il widget Grafico combinato consente di rappresentare serie di dati sul grafico utilizzando più tipi di indicatore, ad esempio colonne, linee, aree e punti. È possibile sovrapporre più insiemi di dati utilizzando diversi tipi di visualizzazione per confrontare le quantità di unità in più serie di dati. L'asse Y rappresenta la quantità e l'asse X rappresenta la categoria. La visualizzazione dei dati utilizzando diversi tipi di visualizzazione del grafico semplifica la lettura delle diverse scale per gli assi Y.
Di seguito sono riportate alcune delle configurazioni principali disponibili per il grafico combinato.
Visualizzare serie di dati utilizzando linee, colonne, aree e punti.
Associare dati di più origini.
Configurare l'ordine di impilamento ZIndex delle serie di dati.
Applicare la formattazione dello stato per definire lo stile del grafico in base ai valori.
Raggruppare e impilare serie di dati.
Best practice
Mantenere attivato il campionamento dei dati per migliorare le prestazioni del grafico in fase di esecuzione. La disattivazione del campionamento dei dati può rallentare le prestazioni quando il grafico visualizza migliaia di punti dati da più serie. Disattivare il campionamento solo quando l'insieme di dati del grafico è ridotto.
Formato dati
È necessario creare un'infotable con definizioni di campi che rappresentano la struttura dati del grafico. L'infotable deve includere una definizione di campo per i valori degli assi X e Y. È possibile aggiungere più serie di dati inserendo ulteriori colonne con definizioni di campo per i valori delle serie di dati. Ogni riga dell'infotable rappresenta una categoria sull'asse X e i corrispondenti valori sull'asse Y. Nella tabella seguente è indicato il formato dei dati per l'infotable:
Asse X
Valore dell'asse Y
Valore N dell'asse Y
Definizione di campo
x:{name: 'x', baseType: 'STRING'}
value1: {name: 'value1', baseType: 'NUMBER'}
value1:{name:'value2',baseType:'NUMBER'}
Utilizzo
Definisce i valori dell'asse X. I dati devono avere un tipo di base STRING, NUMBER o DATETIME. Ogni riga viene visualizzata come categoria sull'asse X. Il nome definito per questa colonna è l'opzione da selezionare per la proprietà del widget XAaxisField.
Definisce il valore dell'asse Y e l'etichetta della legenda per la categoria.
Definisce il valore dell'asse Y e l'etichetta della legenda per ogni serie di dati aggiuntiva.
Tipo di base
STRING, NUMBER o DATETIME
* 
Quando i dati sul grafico vengono visualizzati come barre, le etichette dell'asse X vengono convertite automaticamente in una stringa. È possibile formattare le etichette utilizzando la proprietà XAxisFormat o XAxisDateFormatToken. Le proprietà utilizzate per impostare il numero minimo e massimo sull'asse vengono ignorate e le etichette vengono ordinate in base all'ordine nell'origine della infotable.
NUMBER
NUMBER
Esempio di riga
x: 'Apple' - dove Apple è un nome di categoria da visualizzare sull'asse X.
value1: 10 - il valore dell'asse Y per la categoria.
value2: 30 - il valore dell'asse Y per la serie di dati N.
Nell'immagine seguente viene illustrato un esempio di dati restituiti da un'infotable con quattro definizioni di campo per l'asse Y:
Proprietà del widget
Le proprietà del widget Grafico combinato sono elencate di seguito.
Nome proprietà
Descrizione
Tipo di base
Valore di default
Associabile? (Y/N)
Localizzabile? (Y/N)
AlignBarsAtZero
Allinea a zero le barre di tutti gli assi Y del grafico.
BOOLEAN
False
Y
N
AxisDisplayControl
Aggiunge un menu di configurazione alla barra degli strumenti del grafico che consente di controllare la visibilità degli assi Y in fase di esecuzione.
BOOLEAN
False
Y
N
ChartType
Imposta il tipo di visualizzazione di default utilizzato per visualizzare i dati della serie nel grafico. È possibile sostituire manualmente questa selezione per ogni serie di dati utilizzando la proprietà SeriesNType.
STRING
Linea
N
N
CustomClass
Specifica la classe CSS personalizzata da applicare al widget. È possibile immettere più classi, separate da uno spazio.
STRING
N/D
Y
N
Data
Origine dati dell'infotable per il grafico.
Infotable
N/D
Y
N
DataFieldN
Specifica il campo della infotable da utilizzare per la serie di dati N.
Infotable
N/D
N
N
DataLabelN
Etichetta da visualizzare nell'area delle legende per la serie di dati N.
STRING
N/D
Y
Y
DataPointSelection
Specifica il punto dati da selezionare rispetto alla posizione del puntatore. È possibile impostare la proprietà in modo da selezionare il punto dati più vicino sull'asse verticale, sull'asse orizzontale o su entrambi gli assi. Opzioni:
Nessuno
Posizione puntatore
Orizzontale più vicino
Verticale più vicino
Entrambi gli assi
STRING
N/D
Y
N
DataSeriesStyleN
Consente di applicare la formattazione dello stato per la serie di dati N nel grafico. È possibile applicare lo stile alle serie in base ai valori dei dati per individuare più facilmente i trend e gli schemi.
Formattazione stato
N/D
N
N
DirectSelectionZoom
Consente di eseguire lo zoom avanti selezionando due elementi di dati nel grafico.
Le opzioni disponibili per questa proprietà sono Asse orizzontale, Asse verticale, Entrambi e Nessuno.
Questa proprietà viene visualizzata nell'elenco delle proprietà quando si seleziona HorizontalZoom o VerticalZoom.
STRING
Nessuno
Y
N
DragSelectionZoom
Consente di eseguire lo zoom avanti di una parte specifica del grafico disegnando un riquadro di selezione intorno all'intervallo dei dati che si desidera visualizzare.
Le opzioni disponibili per questa proprietà sono Asse orizzontale, Asse verticale, Entrambi e Nessuno.
Questa proprietà viene visualizzata nell'elenco delle proprietà quando si seleziona HorizontalZoom o VerticalZoom.
STRING
Nessuno
Y
N
Disabled
Disattiva il widget nel mashup.
BOOLEAN
N/D
Y
N
DisplaySeriesNOn
Imposta l'asse Y o il gruppo in pila della serie di dati N.
STRING
N
N
EmptyChartIcon
Specifica l'icona da visualizzare quando il grafico è vuoto.
MEDIA
not visible
N
N
EmptyChartLabel
Specifica il testo da visualizzare quando l'infotable associata non contiene dati.
STRING
[[ChartStateLabelEmpty]]
N
Y
ErrorStateIcon
Specifica l'icona da visualizzare quando non è possibile caricare i dati del grafico.
MEDIA
error
N
N
ErrorStateLabel
Specifica il testo da visualizzare quando non è possibile caricare i dati del grafico.
STRING
[[ChartStateLabelError]]
N
N
ExternalPadding
Imposta la spaziatura interna rispetto agli assi. Il valore della spaziatura interna è una percentuale della larghezza della barra.
NUMBER
25
Y
N
GroupPadding
Imposta la spaziatura interna tra le serie. Il valore della spaziatura interna è una percentuale della larghezza della barra.
NUMBER
25
Y
N
HideLegend
Nasconde l'area della legenda.
BOOLEAN
False
Y
N
HideNotes
Nasconde l'area delle note.
BOOLEAN
False
Y
N
HideValues
Nasconde le etichette dei valori sul grafico.
BOOLEAN
False
Y
N
HideXAxis
Nasconde l'asse X.
BOOLEAN
False
Y
N
HideYAxisN
Nasconde l'asse Y per la serie di dati N.
BOOLEAN
False
Y
N
HorizontalAxisLabelsRotation
Immettere un valore compreso tra -180 e 180 per impostare l'angolo di rotazione delle etichette sull'asse orizzontale.
NUMBER
Calcolato automaticamente
N
N
HorizontalAxisMaxHeight
Imposta un'altezza massima per l'asse orizzontale.
NUMBER
85
Y
N
HorizontalZoom
Consente di eseguire lo zoom avanti o indietro sull'asse orizzontale.
Quando si seleziona questa proprietà, vengono visualizzate le proprietà HorizontalIntervalControl, HorizontalRangeZoom, HorizontalSliderZoom, DirectSelectionZoom e DragSelectionZoom nell'elenco delle proprietà.
BOOLEAN
False
Y
N
HorizontalIntervalControl
Aggiunge i controlli che consentono di eseguire lo zoom avanti sull'asse orizzontale in base a intervalli specifici.
Le opzioni disponibili sono Nessuno, ovvero la selezione di default, ed Elenco a discesa.
Quando si seleziona Elenco a discesa, vengono visualizzate le proprietà HorizontalIntervalControlLabel e HorizontalIntervalData nell'elenco delle proprietà.
STRING
Nessuno
N
N
HorizontalIntervalControlLabel
Specifica l'etichetta di testo dei controlli di zoom dell'intervallo per l'asse orizzontale.
STRING
n/d
Y
Y
HorizontalIntervalData
L'origine dati per le opzioni di controllo dello zoom dell'intervallo.
Quando si seleziona una voce dell'elenco a discesa dell'intervallo orizzontale, viene eseguito lo zoom avanti del grafico in base al valore di durata e al punto di ancoraggio iniziale o finale selezionati.
INFOTABLE
n/d
Y
N
HorizontalIntervalAnchorPoint
Consente di selezionare la posizione di ancoraggio dell'intervallo all'interno dell'insieme di dati.
Selezionare Inizio per posizionare l'intervallo all'inizio dell'insieme di dati o Fine per posizionare l'intervallo alla fine.
Se, ad esempio, si specifica un intervallo di tre mesi in un insieme di dati di 12 mesi, è possibile selezionare Inizio per mostrare i primi 3 mesi o Fine per mostrare gli ultimi 3 mesi dell'insieme di dati.
Questa proprietà viene visualizzata quando si seleziona la proprietà ShowHorizontalAnchorPointControl.
STRING
Inizio
Y
N
HorizontalIntervalAnchorPointLabel
Specifica l'etichetta per il punto di ancoraggio dell'intervallo per l'asse orizzontale.
Questa proprietà viene visualizzata quando si seleziona la proprietà ShowHorizontalAnchorPointControl.
STRING
n/d
Y
Y
HorizontalRangeZoom
Aggiunge i controlli che consentono di specificare un intervallo di valori per eseguire lo zoom avanti sull'asse orizzontale.
Quando si seleziona questa proprietà, vengono visualizzate le proprietà HorizontalStartZoomLabel e HorizontalEndZoomLabel nell'elenco delle proprietà.
BOOLEAN
False
Y
N
HorizontalStartZoomLabel
Specifica l'etichetta di testo per l'inizio della selezione dell'intervallo.
STRING
n/d
Y
Y
HorizontalEndZoomLabel
Specifica l'etichetta di testo per la fine della selezione dell'intervallo.
STRING
n/d
Y
Y
HorizontalSliderZoom
Aggiunge un controllo del dispositivo di scorrimento che consente di visualizzare i dati tra un valore minimo e un valore massimo sull'asse orizzontale.
Quando si seleziona questa proprietà, vengono visualizzate le proprietà HorizontalSliderZoomMaxLabel e HorizontalSliderZoomMinLabel nell'elenco delle proprietà.
BOOLEAN
False
Y
N
HorizontalSliderZoomMaxLabel
Specifica l'etichetta per il valore massimo del controllo di zoom del dispositivo di scorrimento.
STRING
n/d
Y
Y
HorizontalSliderZoomMinLabel
Specifica l'etichetta per il valore minimo del controllo di zoom del dispositivo di scorrimento.
STRING
n/d
Y
Y
InternalPadding
Imposta la spaziatura interna tra le serie. Il valore della spaziatura interna è una percentuale della larghezza della barra.
NUMBER
25
Y
N
Label
Specifica l'etichetta di testo da visualizzare per il grafico combinato.
STRING
[[ComboChart]]
Y
Y
LabelReset
Imposta l'etichetta visualizzata nel pulsante Reimposta sulla barra degli strumenti del grafico.
STRING
Reimposta
Y
Y
LabelAlignment
Allinea il testo dell'etichetta del widget. Opzioni: Nessuno, A sinistra, Al centro, A destra.
STRING
A sinistra
N
N
LabelPosition
Imposta la posizione dell'etichetta di testo. Opzioni: Nessuna, In alto, In basso, A sinistra.
STRING
In alto
N
N
LabelType
Imposta il tipo di etichetta del grafico combinato, ad esempio Intestazione, Sottointestazione, Etichetta o Corpo.
STRING
Sottointestazione
Y
N
LegendAlignment
Allinea la legenda del grafico.
STRING
A sinistra
N
N
LegendFilter
Aggiunge le caselle di controllo accanto alle serie di dati nella legenda che controllano la visibilità delle serie di dati.
BOOLEAN
False
N
N
LegendMaxWidth
Imposta una larghezza massima per l'area della legenda.
NUMBER
736
Y
N
LegendPosition
Imposta la posizione della legenda del grafico. Opzioni:
Nessuna, A sinistra, Al centro, A destra.
STRING
A sinistra
N
N
LoadingIcon
Specifica l'icona da visualizzare durante il caricamento dei dati del grafico.
STRING
chart_loading_combo_pareto
N
N
Margin
Questa proprietà è disattivata. È necessario definire i margini di questo widget dinamico nel relativo contenitore.
STRING
5
N
N
MarkerShape
Imposta la forma dell'indicatore dei punti dati sul grafico. Opzioni: Nessuna, Cerchio, Quadrato, Rombo.
STRING
Cerchio
N
N
MultipleDataSources
Consente di visualizzare i dati di più origini nel grafico.
BOOLEAN
False
N
NoDataSourceIcon
Specifica l'icona da visualizzare quando il grafico non è associato a un'origine dati.
Entità multimediali
bind
N
N
NoDataSourceLabel
Specifica il testo da visualizzare quando il grafico non è associato a un'origine dati.
STRING
[[ChartStateLabelNoData]]
N
Y
Notes
Specifica il testo da visualizzare all'interno dell'area delle note nel grafico. È possibile inserire una stringa o selezionare un token di localizzazione.
STRING
N/D
Y
Y
NotesAlignment
Allinea il testo all'interno dell'area delle note.
STRING
A sinistra
N
N
NotesPosition
Imposta la posizione dell'area delle note.
STRING
In basso
N
N
NumberOfReferenceLines
Imposta il numero di linee di riferimento da visualizzare nel grafico. Le linee di riferimento vengono utilizzate per evidenziare i dati del grafico rispetto a un valore specifico. È possibile aggiungere fino a 24 linee e configurare l'etichetta, l'asse e il valore di ogni riga.
NUMBER
0
N
N
NumberOfSeries
Imposta il numero di serie di dati da visualizzare sul grafico.
NUMBER
8
N
N
NumberOfStacks
Imposta il numero delle pile di serie di dati da visualizzare sul grafico.
NUMBER
0
N
N
NumberOfXLabels
Imposta il numero di etichette sull'asse X.
NUMBER
Automatico
Y
N
NumberOfYaxes
Imposta il numero di assi Y da visualizzare sul grafico.
NUMBER
1
N
N
PointerType
Specifica l'aspetto del puntatore al passaggio del mouse sul grafico. È possibile utilizzare le linee guida per tenere traccia di un valore di dati relativo a un asse. Opzioni: Nessuno, Standard, Linea orizzontale, Linea verticale, Mirino.
STRING
Standard
Y
N
ReferecneLineNLabel
Imposta l'etichetta di testo della linea di riferimento.
STRING
Y
Y
Y
ReferecneLineNValue
Imposta il valore numerico della linea di riferimento.
NUMBER
Y
N
Y
ReferenceLineNAxis
Specifica l'asse da utilizzare per la linea di riferimento.
STRING
N
N
N
ResetToDefaultValue
Ripristina i valori di default degli input di questo widget.
Servizio
N/D
Y
N
ReverseXAxis
Visualizza i valori dell'asse X in ordine inverso.
BOOLEAN
False
N
N
ReverseYAxis
Inverte l'ordine dei valori sull'asse Y.
BOOLEAN
False
N
N
RulersInFront
Mostra i righelli davanti ai valori dei dati. Per default, i righelli vengono visualizzati dietro i dati.
BOOLEAN
False
Y
N
SampleSize
Imposta il numero massimo di punti dati da visualizzare durante la visualizzazione di insiemi di dati di grandi dimensioni sul grafico. Per disattivare il campionamento, impostare questa proprietà su 0.
NUMBER
Automatico
Y
N
SelectedData
Infotable contenente i dati selezionati nel grafico.
INFOTABLE
N/D
Y
N
SelectedSeriesChanged
Evento che viene attivato quando si cambia la serie selezionata.
Evento
N/D
Y
N
SelectionMode
Controlla il numero di punti dati che un utente può selezionare contemporaneamente. Scegliere Più di uno per consentire a un utente di selezionare più punti dati. Opzioni: Nessuno, Default, Uno, Più di uno.
STRING
Default
Y
N
Series1MarkerShape
Imposta la forma dell'indicatore dei punti dati della serie 1 sul grafico.
STRING
Default
N
N
Series1MarkerSize
Imposta la dimensione dell'indicatore della serie di dati 1.
NUMBER
8
Y
N
Series1Type
Imposta il tipo di visualizzazione utilizzato per visualizzare i dati della serie 1 nel grafico.
STRING
Default
N
N
Series1ZAxis
Imposta l'ordine delle serie sull'asse Z. Per default, tutti i gruppi sono impostati sullo stesso valore dell'asse Z. I gruppi in pila sono organizzati in base al tipo di serie seguito da questa proprietà.
NUMBER
0
N
N
SeriesClicked
Attiva un evento quando si fa clic su un punto dati sul grafico.
Evento
N/D
Y
N
ShowChartBands
Evidenzia lo spazio riservato per le categorie delle barre nel grafico. Se impostata su true, l'area di ogni categoria viene ombreggiata con un colore grigio.
BOOLEAN
False
N
N
ShowDataLoading
Mostra un'icona che ruota durante il caricamento dei dati.
BOOLEAN
True
N
N
ShowHideLegend
Aggiunge un pulsante Mostra o Nascondi che consente di mostrare o nascondere la legenda del grafico in fase di esecuzione.
BOOLEAN
False
N
N
ShowHorizontalAnchorPointControl
Aggiunge i controlli per regolare il valore di ancoraggio per l'asse orizzontale.
Quando si seleziona questa proprietà, vengono visualizzate le proprietà HorizontalIntervalAnchorPoint e HorizontalIntervalAnchorPointLabel nell'elenco delle proprietà.
BOOLEAN
False
Y
N
ShowXAxis
Mostra il righello dell'asse X.
BOOLEAN
False
Y
N
ShowYAxis
Mostra il righello dell'asse Y.
BOOLEAN
False
Y
N
ShowXAxisRuler
Mostra il righello dell'asse X.
BOOLEAN
False
Y
N
ShowYAxisRuler
Mostra il righello dell'asse Y.
BOOLEAN
False
Y
N
ShowZeroValueRuler
Mostra il righello di valore zero.
BOOLEAN
False
Y
N
SparkView
Mostra una vista semplificata del grafico. Attivare questa proprietà per nascondere etichette, legende e righelli.
BOOLEAN
False
Y
N
ShowZoomButtons
Mostra i pulsanti per lo zoom avanti e indietro sulla barra degli strumenti del grafico quando è attivato lo zoom orizzontale o verticale.
BOOLEAN
False
N
N
TabSequence
Numero di sequenza del widget quando si preme il tasto TAB.
NUMBER
0
N
N
ValuesPosition
Imposta la posizione delle etichette dei valori dei dati relative ai punti dati.
STRING
Sopra
N
N
ValuesPositionBar
Imposta la posizione delle etichette dei valori dei dati relative alle barre del grafico.
STRING
Fuori dalla barra
N
N
ValuesTooltip
STRING
Y
Y
VerticalAxisMaxWidth
Imposta una larghezza massima per l'asse verticale.
NUMBER
85
Y
N
VerticalZoom
Consente di eseguire lo zoom avanti o indietro sull'asse verticale.
BOOLEAN
False
Y
N
VerticalSliderZoom
Aggiunge un controllo del dispositivo di scorrimento che consente di visualizzare i dati tra un valore minimo e un valore massimo sull'asse verticale.
Quando si seleziona questa proprietà, vengono visualizzate le proprietà VerticalZoomMaxLabel e VerticalZoomMinLabel nell'elenco delle proprietà.
BOOLEAN
False
Y
N
VerticalZoomMaxLabel
Specifica l'etichetta di testo per il valore massimo del controllo di zoom del dispositivo di scorrimento.
STRING
N/D
Y
Y
VerticalZoomMinLabel
Specifica l'etichetta di testo per il valore minimo del controllo di zoom del dispositivo di scorrimento.
STRING
N/D
Y
Y
Visible
Se la proprietà è attivata, il widget è visibile nel mashup.
BOOLEAN
True
Y
N
XAxisField
Selezionare il campo della infotable contenente i dati dell'asse X.
INFOTABLE
N/D
N
N
XAxisLabel
Specifica l'etichetta di testo dell'asse X.
STRING
[[XAxis]]
Y
Y
XAxisLabelAlignment
Allinea l'etichetta dell'asse X.
STRING
A sinistra
N
N
XAxisType
Imposta il tipo di formato dei valori dell'asse X.
STRING
Stringa
Y
N
YAxesMaxWidth
Imposta una larghezza massima per l'area degli assi Y. Quando l'area supera la larghezza massima, viene visualizzata una barra di scorrimento.
NUMBER
1200
Y
N
YAxisNFormat
Imposta il formato per i valori dell'asse Y N.
STRING
0000,0
Y
N
YAxisNLabel
Specifica l'etichetta di testo dell'asse Y N.
STRING
[[YAxis]]
Y
Y
YAxisNLabelAlignment
Allinea l'etichetta dell'asse Y N.
STRING
Al centro
N
N
YAxisNMaximumValue
Imposta il valore massimo per l'intervallo dell'asse Y. Per default, l'intervallo viene calcolato automaticamente in base ai dati del widget.
NUMBER
Automatico
Y
N
YAxisNMinimumValue
Imposta il valore minimo per l'intervallo dell'asse Y. Per default, l'intervallo viene calcolato automaticamente in base ai dati del widget.
NUMBER
Automatico
Y
N
YAxisNNumberOfLabels
Imposta il numero di etichette dell'asse Y N.
NUMBER
Automatico
Y
N
YAxisNPosition
Specifica la posizione dell'asse Y. Con l'impostazione Automatico, il primo asse Y viene visualizzato come principale e il resto come secondario.
STRING
Automatico
N
N
ZeroValueRuler
Controlla la visibilità dei righelli di valore zero sul grafico. È possibile visualizzare il righello solo per l'asse Y principale o secondario. Opzioni: Asse principale, Asse secondario, Nessuno, Entrambi.
STRING
Nessuno
Y
N
È stato utile?