Libreria grafica e gestione click

Introduzione

In questo articolo vengono descritti i metodi principali utilizzati per cambiare la configurazione di un grafico a run-time; per una trattazione completa di esempi e note di funzionamento si vedano gli articoli corrispondenti nella Libreria Grafico. Vedremo inoltre come gestire il click dell'utente su un punto del grafico attraverso l'evento Graph Click.

Metodi generali

• SetLibrary: questo metodo permette di selezionare quale libreria utilizzare per il rendering del grafico. Le librerie possibili sono JFreeChart o FusionChart.
• SetLibraryName: nel caso si sia creata una libreria personalizzata (vedi articolo Estensioni) è possibile selezionarla passando a questo metodo una stringa contenente il nome della classe personalizzata.
• SetDirection: è possibile scegliere l'orientamento del grafico: orizzontale o verticale.
• SetImageFormat: questo metodo permette di selezionare il formato dell'immagine creata dalla libreria JFreeChart: jpg o png.
• SetTimePeriod: permette di selezionare la grandezza delle barre in un grafico di tipo temporale.
• SetStackedChart: permette di selezionare se in un grafico di tipo barre o area i dati delle serie sono impilati o meno.

Metodi di configurazione dell'Asse X

• XAxisVisualStyle: questa proprietà configura il Visual Style usato dall'asse X.
• EnableXAxisAutoRange: attiva l'autorange sull'asse X in JFreeChart per un grafico di tipo Scatter o XY.
• SetXAxisRange: imposta il valore minimo e massimo dell'asse X per un grafico di tipo Scatter o XY.

Metodi di configurazione dell'Asse Y

• YAxisVisualStyle: questa proprietà configura il Visual Style usato dall'asse Y.
• EnableYAxisAutoRange: attiva l'autorange sull'asse Y per un grafico di tipo Scatter o XY.
• SetYAxisRange: imposta il valore minimo e massimo dell'asse Y per un grafico di tipo Scatter o XY.

Metodi di configurazione dei grafici a torta

• ShowPercentage: rende visibili o meno le percentuali nelle label dei valori di un grafico a torta.
• SetExplosion: imposta l'Explosion, cioè la separazione dal grafico, di una sezione del grafico a torta.

Metodi per la configurazione delle serie

• SetSerieName: imposta il nome della serie; la numerazione delle serie inizia da 1.
• SetSerieVisualStyle: imposta il visual style della serie che ne determinerà colore di riempimento e tipo di bordo.
• SetSerieType: è possibile mescolare grafici a linee e a barre. All'interno di un grafico appartenente a questi tipi è possibile configurare una serie in modo da essere disegnata come linea in un grafico a barre oppure come barra in un grafico a linee.

Evento Graph Click

Se il grafico è stato definito come attivo impostando il flag corrispondente nella videata delle proprietà in IN.DE, l'utente può cliccare su di esso per selezionare uno dei punti. In questo caso il grafico notifica all'applicazione l'evento Graph Click.

L'argomento fornito dall'evento permette di sapere a quale serie appartiene il punto selezionato dall'utente . E' possibile referenziare le colonne della master query del grafico, come solitamente avviene per i pannelli, per accedere ai dati del punto cliccato dall'utente.

A partire dalla versione 7.5 è stato aggiunto un nuovo argomento che indica il punto selezionato dall'utente, questo può essere utilizzato nei grafici a torta per separare la sezione cliccata.

Esempio di grafico master detail

Come esempio d'uso dei grafici attivi, immaginiamo di voler creare due grafici funzionanti in modalità master-detail. Il grafico master è un grafico a torta che rappresenta il valore delle vendite nell'anno 2007, suddiviso nelle varie aree commerciali dell'azienda; il grafico detail è lo storico del venduto dell'area negli ultimi anni. Vogliamo quindi che cliccando sulla sezione di un'area nel grafico a torta il grafico detail cambi e mostri lo storico dell'area.

Per ottenere questo risultato, per prima cosa creiamo all'interno di una videata due grafici, uno chiamato Vendite ed uno chiamato Storico. Impostiamo la master query del grafico Vendite, selezionando dalla relativa tabella le vendite dell'anno 2007. Infine impostiamo il grafico Vendite di tipo torta.

La master query del grafico di dettaglio deve estrarre i dati dello storico delle vendite dell'area cliccata nel grafico master. Selezioniamo quindi le colonne anno e quantità venduta dalla tabella vendite e inseriamo un criterio di filtro per selezionare i dati dell'area correntemente selezionata nel primo grafico.

Quando l'utente clicca sul grafico master, la query del grafico detail si aggiorna automaticamente, ottenendo il risultato voluto.

Per completare l'esempio gestiamo l'evento Graph Click, modificando a runtime il titolo del grafico detail a seconda dell'area selezionata dall'utente e facendo separare la sezione selezionata del grafico a torta.

L'immagine seguente mostra il risultato ottenuto.