JavaFX 線圖示例,包含多個序列(線條)


內聯圖表,資料值表示由線連線的一系列點。在 JavaFX 中,您可以透過例項化 **javafx.scene.chart.LineChart** 類來建立線圖。

例項化此類時,必須傳遞 Axis 類的兩個物件,分別表示 x 軸和 y 軸(作為建構函式的引數)。由於 Axis 類是抽象類,因此您需要傳遞其具體子類的物件,例如 NumberAxis(用於數值)或 CategoryAxis(用於字串值)。

包含多個序列的線圖

  • **XYChart.Data** 類表示圖表中的資料點,您可以透過例項化此類來建立資料點。

XYChart.Data dataPoint1 = new XYChart.Data(x-value, y-value)
XYChart.Data dataPoint2 = new XYChart.Data(x-value, y-value)
XYChart.Data dataPoint3 = new XYChart.Data(x-value, y-value)
  • 建立所有所需的資料點後,您可以建立序列,需要例項化 **XYChart.Series** 類並將資料點新增到其中。

XYChart.Series series = XYChart.Series
series.getData().add(dataPoint1);
series.getData().add(dataPoint2);
series.getData().add(dataPoint3);
  • 您可以根據需要建立任意數量的此類序列。

示例

以下示例演示如何建立包含多條線的線圖。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.scene.layout.StackPane;
public class LineChart_MultipleLines extends Application {
   public void start(Stage stage) {
      //Defining the x an y axes
      CategoryAxis xAxis = new CategoryAxis();
      NumberAxis yAxis = new NumberAxis();
      //Setting labels for the axes
      xAxis.setLabel("Month");
      yAxis.setLabel("Temperature(°C)");
      //Creating a line chart
      LineChart<String, Number> linechart = new LineChart<String, Number>(xAxis, yAxis);
      //Preparing the data points for the line1
      XYChart.Series series1 = new XYChart.Series();
      series1.getData().add(new XYChart.Data("Jan", 7.0));
      series1.getData().add(new XYChart.Data("Feb", 6.9));
      series1.getData().add(new XYChart.Data("March", 9.5));
      series1.getData().add(new XYChart.Data("April", 14.5));
      series1.getData().add(new XYChart.Data("May", 18.2));
      series1.getData().add(new XYChart.Data("June", 21.5));
      series1.getData().add(new XYChart.Data("July", 25.2));
      series1.getData().add(new XYChart.Data("August", 26.5));
      series1.getData().add(new XYChart.Data("Sep", 23.3));
      series1.getData().add(new XYChart.Data("Oct", 18.3));
      series1.getData().add(new XYChart.Data("Nov", 13.9));
      series1.getData().add(new XYChart.Data("Dec", 9.6));
      //Preparing the data points for the line2
      XYChart.Series series2 = new XYChart.Series();
      series2.getData().add(new XYChart.Data("Jan", -0.2));
      series2.getData().add(new XYChart.Data("Feb", 0.8));
      series2.getData().add(new XYChart.Data("March", 5.7));
      series2.getData().add(new XYChart.Data("April", 11.3));
      series2.getData().add(new XYChart.Data("May", 17.0));
      series2.getData().add(new XYChart.Data("June", 22.0));
      series2.getData().add(new XYChart.Data("July", 24.8));
      series2.getData().add(new XYChart.Data("August", 24.1));
      series2.getData().add(new XYChart.Data("Sep", 20.1));
      series2.getData().add(new XYChart.Data("Oct", 14.1));
      series2.getData().add(new XYChart.Data("Nov", 8.6));
      series2.getData().add(new XYChart.Data("Dec", 2.5));
      //Preparing the data points for the line3
      XYChart.Series series3 = new XYChart.Series();
      series3.getData().add(new XYChart.Data("Jan", 3.9));
      series3.getData().add(new XYChart.Data("Feb", 4.2));
      series3.getData().add(new XYChart.Data("March", 5.7));
      series3.getData().add(new XYChart.Data("April", 8.5));
      series3.getData().add(new XYChart.Data("May", 11.9));
      series3.getData().add(new XYChart.Data("June", 15.2));
      series3.getData().add(new XYChart.Data("July", 17.0));
      series3.getData().add(new XYChart.Data("August", 16.6));
      series3.getData().add(new XYChart.Data("Sep", 14.2));
      series3.getData().add(new XYChart.Data("Oct", 10.3));
      series3.getData().add(new XYChart.Data("Nov", 6.6));
      series3.getData().add(new XYChart.Data("Dec", 4.8));
      //Setting the name to the line (series)
      series1.setName("Tokyo");
      series2.setName("New York");
      series3.setName("London");
      //Setting the data to Line chart
      linechart.getData().addAll(series1, series2, series3);
      //Creating a stack pane to hold the chart
      StackPane pane = new StackPane(linechart);
      pane.setPadding(new Insets(15, 15, 15, 15));
      pane.setStyle("-fx-background-color: BEIGE");
      //Setting the Scene
      Scene scene = new Scene(pane, 595, 350);
      stage.setTitle("Line Chart");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

輸出

更新於:2020年5月20日

1K+ 次瀏覽

啟動您的 職業生涯

完成課程獲得認證

開始學習
廣告