JavaFX - 氣泡圖



氣泡圖用於繪製三維資料;第三維由氣泡的大小(半徑)表示。

下面是一個描繪已完成工作的示例氣泡圖。

Bubble Chart

JavaFX 中的氣泡圖

在 JavaFX 中,氣泡圖由名為 BubbleChart 的類表示。此類屬於 javafx.scene.chart 包。透過例項化此類,您可以在 JavaFX 中建立氣泡圖節點。

要在 JavaFX 中生成氣泡圖,請按照以下步驟操作。

步驟 1:定義軸

定義氣泡圖的 X 軸和 Y 軸,併為其設定標籤。在我們的示例中,X 軸代表年齡,Y 軸代表體重。氣泡的半徑代表已完成的工作量。

public class ClassName extends Application {  
   @Override     
   public void start(Stage primaryStage) throws Exception {
      //Defining the X axis               
      NumberAxis xAxis = new NumberAxis(0, 100, 10);        
      xAxis.setLabel("Age");  

      //Defining Y axis        
      NumberAxis yAxis = new NumberAxis(20, 100, 10); 
      yAxis.setLabel("Weight");
   }    
 }

步驟 2:建立氣泡圖

透過例項化 javafx.scene.chart 包中名為 BubbleChart 的類來建立一個氣泡圖。將表示在先前步驟中建立的 X 軸和 Y 軸的物件傳遞給此類的建構函式。

//Creating the Bubble chart 
BubbleChart bubbleChart = new BubbleChart(xAxis, yAxis);

步驟 3:準備資料

例項化 XYChart.Series 類並將資料(一系列 x 和 y 座標)新增到此類的 Observable 列表中,如下所示:

//Prepare XYChart.Series objects by setting data        
XYChart.Series series = new XYChart.Series();  
series.setName("work");  

series.getData().add(new XYChart.Data(10,30,4));  
series.getData().add(new XYChart.Data(25,40,5)); 
series.getData().add(new XYChart.Data(40,50,9)); 
series.getData().add(new XYChart.Data(55,60,7));    
series.getData().add(new XYChart.Data(70,70,9));        
series.getData().add(new XYChart.Data(85,80,6)); 

步驟 4:將資料新增到氣泡圖

將上一步中準備的資料系列新增到氣泡圖中,如下所示:

//Setting the data to bar chart        
bubbleChart.getData().add(series); 

步驟 5:建立 Group 物件

start() 方法中,透過例項化名為 Group 的類來建立一個 Group 物件。這屬於 javafx.scene 包。

將上一步中建立的氣泡圖(節點)物件作為引數傳遞給 Group 類的建構函式。這應該按如下方式完成,以便將其新增到組中:

Group root = new Group(bubbleChart);

步驟 6:啟動應用程式

最後,按照以下步驟正確啟動應用程式:

  • 首先,透過將 Group 物件作為引數值傳遞給其建構函式來例項化名為 Scene 的類。您可以將應用程式螢幕的尺寸作為可選引數傳遞給此建構函式。

  • 然後,使用 Stage 類的 setTitle() 方法設定舞臺的標題。

  • 現在,使用名為 Stage 的類的 setScene() 方法將 Scene 物件新增到舞臺。

  • 使用名為 show() 的方法顯示場景的內容。

  • 最後,使用 launch() 方法啟動應用程式。

示例

讓我們考慮不同的個體及其年齡、體重和工作能力。工作能力可以視為工作小時數,在圖表中繪製為氣泡。

體重
年齡
30 40 50 60 70 80
10 4 工作量
25 5
40 6
55 8
70 9
85 15

以下是一個 Java 程式,它使用 JavaFX 生成一個氣泡圖,描繪了上述資料。

將此程式碼儲存在名為 BubbleChartExample.java 的檔案中。

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.chart.BubbleChart; 
import javafx.stage.Stage;  
import javafx.scene.chart.NumberAxis; 
import javafx.scene.chart.XYChart; 
         
public class BubbleChartExample extends Application { 
   @Override 
   public void start(Stage stage) {     
      //Defining the axes               
      NumberAxis xAxis = new NumberAxis(0, 100, 10);        
      xAxis.setLabel("Age"); 
        
      NumberAxis yAxis = new NumberAxis(20, 100, 10); 
      yAxis.setLabel("Weight"); 
      
      //Creating the Bubble chart 
      BubbleChart bubbleChart = new BubbleChart(xAxis, yAxis);    
         
      //Prepare XYChart.Series objects by setting data        
      XYChart.Series series = new XYChart.Series();  
      series.setName("work"); 
         
      series.getData().add(new XYChart.Data(10,30,4));  
      series.getData().add(new XYChart.Data(25,40,5)); 
      series.getData().add(new XYChart.Data(40,50,9)); 
      series.getData().add(new XYChart.Data(55,60,7));    
      series.getData().add(new XYChart.Data(70,70,9));        
      series.getData().add(new XYChart.Data(85,80,6));
      
      //Setting the data to bar chart         
      bubbleChart.getData().add(series); 
         
      //Creating a Group object  
      Group root = new Group(bubbleChart); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 400);  
      
      //Setting title to the Stage 
      stage.setTitle("Bubble 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); 
   } 
}

使用以下命令從命令提示符編譯並執行儲存的 Java 檔案。

javac --module-path %PATH_TO_FX% --add-modules javafx.controls BubbleChartExample.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls BubbleChartExample

輸出

執行上述程式後,將生成一個 JavaFX 視窗,顯示如下所示的氣泡圖。

Bubblechart Example

示例

下表顯示了 1970 年至 2014 年某地區學校的數量。

年份 學校數量
1970 15
1980 30
1990 60
2000 120
2013 240
2014 300

以下是一個 Java 程式,它使用 JavaFX 生成一個氣泡圖,描繪了上述資料。

將此程式碼儲存在名為 BubbleChartSchools.java 的檔案中。

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.stage.Stage; 
import javafx.scene.chart.BubbleChart; 
import javafx.scene.chart.NumberAxis; 
import javafx.scene.chart.XYChart; 
         
public class BubbleChartSchools extends Application { 
   @Override 
   public void start(Stage stage) {
      //Defining the x axis             
      NumberAxis xAxis = new NumberAxis(1960, 2020, 10); 
      xAxis.setLabel("Years"); 
        
      //Defining the y axis   
      NumberAxis yAxis = new NumberAxis(20, 320, 20); 
      yAxis.setLabel("No.of schools"); 
        
      //Creating the Bubble chart 
      BubbleChart bubblechart = new BubbleChart(xAxis, yAxis);  
        
      //Prepare XYChart.Series objects by setting data
      XYChart.Series series = new XYChart.Series(); 
      series.setName("No of schools in an year"); 
      // Add a third coordinate representing the radius of bubble
      series.getData().add(new XYChart.Data(1970, 25, 1)); 
      series.getData().add(new XYChart.Data(1980, 30, 2)); 
      series.getData().add(new XYChart.Data(1990, 60, 3)); 
      series.getData().add(new XYChart.Data(2000, 120, 4)); 
      series.getData().add(new XYChart.Data(2013, 240, 5)); 
      series.getData().add(new XYChart.Data(2014, 300, 6)); 
            
      //Setting the data to bubble chart    
      bubblechart.getData().add(series);        
        
      //Creating a Group object  
      Group root = new Group(bubblechart); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 400);  
      
      //Setting title to the Stage 
      stage.setTitle("Bubble 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); 
   } 
}

使用以下命令從命令提示符編譯並執行儲存的 Java 檔案。

javac --module-path %PATH_TO_FX% --add-modules javafx.controls BubbleChartSchools.java 
java --module-path %PATH_TO_FX% --add-modules javafx.controls BubbleChartSchools

輸出

執行上述程式後,將生成一個 JavaFX 視窗,顯示如下所示的氣泡圖。

Bubblechart Example
廣告
© . All rights reserved.