JavaFX - Grafico ad area in pila

StackedArea Chart è una variazione del grafico ad area che mostra le tendenze del contributo di ciascun valore (ad esempio, gli straordinari). Le aree sono impilate in modo che ogni serie sia adiacente, ma non si sovrapponga alla serie precedente. Ciò contrasta con il grafico ad area in cui ogni serie si sovrappone alla serie precedente.

Di seguito è riportato un grafico in pila che rappresenta la crescita della popolazione.

In JavaFX, un grafico ad area in pila è rappresentato da una classe denominata StackedAreaChart. Questa classe appartiene al pacchettojavafx.scene.chart. Istanziando questa classe, è possibile creare un nodo StackedAreaChart in JavaFX.

Passaggi per generare un grafico ad area in pila

Per generare un grafico ad area in pila in JavaFX, seguire i passaggi indicati di seguito.

Passaggio 1: creazione di una classe

Crea una classe Java ed eredita il file Application classe del pacchetto javafx.application. Quindi puoi implementare il filestart() metodo di questa classe come segue.

public class ClassName extends Application { 
   @Override     
   public void start(Stage primaryStage) throws Exception {     
   }    
}

Passaggio 2: definizione dell'asse

Definisci gli assi X e Y del grafico ad area in pila e imposta le etichette su di essi. Nel nostro esempio, l'asse X rappresenta vari anni dal 1750 al 2050. Questi hanno unità di tick principali per ogni 50 anni. Mentre l'asse Y rappresenta la crescita della popolazione in milioni.

//Defining the X axis               
CategoryAxis xAxis = new CategoryAxis();    

xAxis.setCategories(FXCollections.<String>observableArrayList
   (Arrays.asList("1 750", "1800", "1850", "1900", "1950", "1999", "2050" )));  

//Defining the Y axis 
NumberAxis yAxis = new NumberAxis(0, 10000, 2500); 
yAxis.setLabel("Population in Billions");

Passaggio 3: creazione del grafico ad area in pila

Crea un grafico a linee istanziando la classe denominata StackedAreaChart del pacchetto javafx.scene.chart. Al costruttore di questa classe, passare gli oggetti che rappresentano gli assi X e Y creati nel passaggio precedente.

//Creating the Area chart 
StackedAreaChart<String, Number> areaChart = new StackedAreaChart(xAxis, yAxis);         
areaChart.setTitle("Historic and Estimated Worldwide Population Growth by Region");

Passaggio 4: preparazione dei dati

Istanziare il file XYChart.Series class e aggiungi i dati (una serie di coordinate xey) all'elenco osservabile di questa classe come segue:

//Prepare XYChart.Series objects by setting data 
XYChart.Series series1 = new XYChart.Series();  
series1.setName("Asia"); 
series1.getData().add(new XYChart.Data("1750", 502)); 
series1.getData().add(new XYChart.Data("1800", 635)); 
series1.getData().add(new XYChart.Data("1850", 809)); 
series1.getData().add(new XYChart.Data("1900", 947)); 
series1.getData().add(new XYChart.Data("1950", 1402)); 
series1.getData().add(new XYChart.Data("1999", 3634)); 
series1.getData().add(new XYChart.Data("2050", 5268));  

XYChart.Series series2 = new XYChart.Series();  
series2.setName("Africa"); 
series2.getData().add(new XYChart.Data("1750", 106)); 
series2.getData().add(new XYChart.Data("1800", 107)); 
series2.getData().add(new XYChart.Data("1850", 111)); 
series2.getData().add(new XYChart.Data("1900", 133)); 
series2.getData().add(new XYChart.Data("1950", 221)); 
series2.getData().add(new XYChart.Data("1999", 767)); 
series2.getData().add(new XYChart.Data("2050", 1766));       

XYChart.Series series3 = new XYChart.Series();  
series3.setName("Europe"); 
series3.getData().add(new XYChart.Data("1750", 163)); 
series3.getData().add(new XYChart.Data("1800", 203)); 
series3.getData().add(new XYChart.Data("1850", 276)); 
series3.getData().add(new XYChart.Data("1900", 408)); 
series3.getData().add(new XYChart.Data("1950", 547)); 
series3.getData().add(new XYChart.Data("1999", 729)); 
series3.getData().add(new XYChart.Data("2050", 628));  

XYChart.Series series4 = new XYChart.Series();  
series4.setName("America"); 
series4.getData().add(new XYChart.Data("1750", 18)); 
series4.getData().add(new XYChart.Data("1800", 31));   

series4.getData().add(new XYChart.Data("1850", 54)); 
series4.getData().add(new XYChart.Data("1900", 156)); 
series4.getData().add(new XYChart.Data("1950", 339)); 
series4.getData().add(new XYChart.Data("1999", 818)); 
series4.getData().add(new XYChart.Data("2050", 1201));  

XYChart.Series series5 = new XYChart.Series();  
series5.setName("Oceania"); 
series5.getData().add(new XYChart.Data("1750", 2)); 
series5.getData().add(new XYChart.Data("1800", 2)); 
series5.getData().add(new XYChart.Data("1850", 2)); 
series5.getData().add(new XYChart.Data("1900", 6)); 
series5.getData().add(new XYChart.Data("1950", 13)); 
series5.getData().add(new XYChart.Data("1999", 30)); 
series5.getData().add(new XYChart.Data("2050", 46));

Passaggio 5: aggiungere dati al grafico ad area in pila

Aggiungere le serie di dati preparate nel passaggio precedente al grafico ad area in pila come segue:

//Setting the data to area chart        
areaChart.getData().addAll(series1, series2, series3, series4, series5);

Passaggio 6: creazione di un oggetto gruppo

Nel start() metodo, creare un oggetto gruppo istanziando la classe denominata Group, che appartiene al pacchetto javafx.scene.

Passare l'oggetto StackedAreaChart (nodo) creato nel passaggio precedente come parametro al costruttore della classe Group. Questo dovrebbe essere fatto per aggiungerlo al gruppo come segue:

Group root = new Group(stackedAreaChart);

Passaggio 7: creazione di un oggetto scena

Crea una scena istanziando la classe denominata Scene, che appartiene al pacchetto javafx.scene. A questa classe, passa l'oggetto Group (root) creato nel passaggio precedente.

Oltre all'oggetto radice, puoi anche passare due parametri doppi che rappresentano l'altezza e la larghezza dello schermo, insieme all'oggetto della classe Group come segue.

Scene scene = new Scene(group ,600, 300);

Passaggio 8: impostazione del titolo dello stage

Puoi impostare il titolo dello stage utilizzando il setTitle() metodo del Stageclasse. IlprimaryStage è un oggetto Stage, che viene passato al metodo di avvio della classe scene come parametro.

Usando il primaryStage oggetto, imposta il titolo della scena come Sample Application come segue.

primaryStage.setTitle("Sample Application");

Passaggio 9: aggiunta di una scena allo stage

Puoi aggiungere un oggetto Scene allo stage utilizzando il metodo setScene() della classe denominata Stage. Aggiungere l'oggetto Scene preparato nei passaggi precedenti utilizzando questo metodo come segue.

primaryStage.setScene(scene);

Passaggio 10: visualizzazione dei contenuti dello stage

Visualizza il contenuto della scena utilizzando il metodo denominato show() del Stage classe come segue.

primaryStage.show();

Passaggio 11: avvio dell'applicazione

Avvia l'applicazione JavaFX chiamando il metodo statico launch() del Application class dal metodo principale come segue.

public static void main(String args[]){   
   launch(args);      
}

Esempio

La tabella seguente elenca la popolazione dei diversi continenti dall'anno 1750 fino all'anno 2050.

	Asia	Africa	Europa	America	Oceania
1750	502	106	163	18	2
1800	635	107	203	31	2
1850	809	111	276	54	2
1900	947	133	408	156	6
1950	1402	221	547	339	13
1999	3634	767	729	818	30
2050	5268	1766	628	1201	46

Di seguito è riportato un programma Java che genera un grafico ad area in pila raffigurante i dati di cui sopra utilizzando JavaFX.

Salva questo codice in un file con il nome StackedAreaChartExample.java.

import java.util.Arrays; 
import javafx.application.Application; 
import static javafx.application.Application.launch; 
import javafx.collections.FXCollections; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.chart.CategoryAxis; 
import javafx.stage.Stage; 
import javafx.scene.chart.NumberAxis; 
import javafx.scene.chart.StackedAreaChart; 
import javafx.scene.chart.XYChart; 
         
public class StackedAreaChartExample extends Application { 
   @Override 
   public void start(Stage stage) {     
      //Defining the axes               
      CategoryAxis xAxis = new CategoryAxis();      
      xAxis.setCategories(FXCollections.<String>observableArrayList( 
      Arrays.asList("1750", "1800", "1850", "1900", "1950", "1999", "2050" ))); 
         
      NumberAxis yAxis = new NumberAxis(0, 10000, 2500); 
      yAxis.setLabel("Population in Millions");     
      
      //Creating the Area chart 
      StackedAreaChart<String, Number> areaChart = new StackedAreaChart(xAxis, yAxis);
      areaChart.setTitle("Historic and Estimated Worldwide Population Growth by Region");
         
      //Prepare XYChart.Series objects by setting data 
      XYChart.Series series1 = new XYChart.Series();  
      
      series1.setName("Asia"); 
      series1.getData().add(new XYChart.Data("1750", 502)); 
      series1.getData().add(new XYChart.Data("1800", 635)); 
      series1.getData().add(new XYChart.Data("1850", 809)); 
      series1.getData().add(new XYChart.Data("1900", 947)); 
      series1.getData().add(new XYChart.Data("1950", 1402)); 
      series1.getData().add(new XYChart.Data("1999", 3634)); 
      series1.getData().add(new XYChart.Data("2050", 5268));         
                         
      XYChart.Series series2 = new XYChart.Series();  
      series2.setName("Africa"); 
      series2.getData().add(new XYChart.Data("1750", 106)); 
      series2.getData().add(new XYChart.Data("1800", 107)); 
      series2.getData().add(new XYChart.Data("1850", 111)); 
      series2.getData().add(new XYChart.Data("1900", 133)); 
      series2.getData().add(new XYChart.Data("1950", 221)); 
      series2.getData().add(new XYChart.Data("1999", 767)); 
      series2.getData().add(new XYChart.Data("2050", 1766));      
         
      XYChart.Series series3 = new XYChart.Series();   
      series3.setName("Europe"); 
  
      series3.getData().add(new XYChart.Data("1750", 163)); 
      series3.getData().add(new XYChart.Data("1800", 203)); 
      series3.getData().add(new XYChart.Data("1850", 276)); 
      series3.getData().add(new XYChart.Data("1900", 408)); 
      series3.getData().add(new XYChart.Data("1950", 547)); 
      series3.getData().add(new XYChart.Data("1999", 729)); 
      series3.getData().add(new XYChart.Data("2050", 628)); 
         
      XYChart.Series series4 = new XYChart.Series();  
      series4.setName("America"); 
      series4.getData().add(new XYChart.Data("1750", 18)); 
      series4.getData().add(new XYChart.Data("1800", 31)); 
      series4.getData().add(new XYChart.Data("1850", 54)); 
      series4.getData().add(new XYChart.Data("1900", 156)); 
      series4.getData().add(new XYChart.Data("1950", 339)); 
      series4.getData().add(new XYChart.Data("1999", 818)); 
      series4.getData().add(new XYChart.Data("2050", 1201)); 
         
      XYChart.Series series5 = new XYChart.Series();  
      series5.setName("Oceania"); 
      series5.getData().add(new XYChart.Data("1750", 2)); 
      series5.getData().add(new XYChart.Data("1800", 2)); 
      series5.getData().add(new XYChart.Data("1850", 2)); 
      series5.getData().add(new XYChart.Data("1900", 6)); 
      series5.getData().add(new XYChart.Data("1950", 13)); 
      series5.getData().add(new XYChart.Data("1999", 30)); 
      series5.getData().add(new XYChart.Data("2050", 46)); 
                
      //Setting the data to area chart        
      areaChart.getData().addAll(series1, series2, series3, series4, series5); 
         
      //Creating a Group object  
      Group root = new Group(areaChart); 
          
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 400); 
      
      //Setting title to the Stage 
      stage.setTitle("Stacked Area Chart"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show();         
   } 
   public static void main(String args[]){ 
      launch(args); 
   } 
}

Compilare ed eseguire il file java salvato dal prompt dei comandi utilizzando i seguenti comandi.

javac StackedAreaChartExample.java 
java StackedAreaChartExample

All'esecuzione, il programma di cui sopra genera una finestra JavaFX che mostra un grafico ad area in pila come mostrato di seguito.

↰ Previous page