Javafx-stacked-area-chart

提供：Dev Guides
移動先:案内、検索

JavaFX-積み上げ面グラフ

StackedAreaチャートは、エリアチャートのバリエーションで、各値の貢献度の傾向を表示します（たとえば、時間外）。 各シリーズが隣接するようにエリアが積み重ねられますが、前のシリーズとは重なりません。 これは、各シリーズが前のシリーズに重なる面グラフとは対照的です。

以下は、人口増加を示す積み上げグラフです。

スタックエリア

JavaFXでは、積み上げ面グラフは StackedAreaChart という名前のクラスで表されます。 このクラスは、パッケージ javafx.scene.chart に属します。 このクラスをインスタンス化することにより、JavaFXでStackedAreaChartノードを作成できます。

積み上げ面グラフを生成する手順

JavaFXで積み上げ面グラフを生成するには、以下の手順に従います。

ステップ1：クラスを作成する

Javaクラスを作成し、パッケージ javafx.application の Application クラスを継承します。 次に、このクラスの* start（）*メソッドを次のように実装できます。 

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

ステップ2：軸の定義

積み上げ面グラフのX軸とY軸を定義し、それらにラベルを設定します。 この例では、X軸は1750年から2050年までのさまざまな年を表します。 これらには、50年ごとに主要なティック単位があります。 Y軸は人口増加を数百万単位で表しています。 

//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");

ステップ3：積み上げ面グラフの作成

パッケージ javafx.scene.chart の StackedAreaChart という名前のクラスをインスタンス化して、折れ線グラフを作成します。 このクラスのコンストラクターに、前の手順で作成したX軸とY軸を表すオブジェクトを渡します。 

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

ステップ4：データの準備

*XYChart.Series* クラスをインスタンス化し、次のようにこのクラスのObservableリストにデータ（一連のx、y座標）を追加します-
//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));

ステップ5：積み上げ面グラフにデータを追加する

次のように、前の手順で準備したデータ系列を積み上げ面グラフに追加します- 

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

ステップ6：グループオブジェクトの作成

  • start（）メソッドで、パッケージ *javafx.scene に属する Group という名前のクラスをインスタンス化して、グループオブジェクトを作成します。

前の手順で作成したStackedAreaChart（ノード）オブジェクトをパラメーターとしてGroupクラスのコンストラクターに渡します。 これは、次のようにグループに追加するために行う必要があります- 

Group root = new Group(stackedAreaChart);

ステップ7：シーンオブジェクトの作成

パッケージ javafx.scene に属する Scene という名前のクラスをインスタンス化して、シーンを作成します。 このクラスに、前の手順で作成したGroupオブジェクト（ root ）を渡します。

ルートオブジェクトに加えて、画面の高さと幅を表す2つのdoubleパラメータを、Groupクラスのオブジェクトとともに次のように渡すこともできます。 

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

ステップ8：ステージのタイトルを設定する

*Stage* クラスの* setTitle（）*メソッドを使用して、ステージにタイトルを設定できます。 *primaryStage* はStageオブジェクトであり、シーンクラスのstartメソッドにパラメーターとして渡されます。
*primaryStage* オブジェクトを使用して、シーンのタイトルを次のように *Sample Application* として設定します。
primaryStage.setTitle("Sample Application");

ステップ9：ステージにシーンを追加する

*Stage* という名前のクラスの* setScene（）*メソッドを使用して、Sceneオブジェクトをステージに追加できます。 この方法を使用して、前の手順で準備したSceneオブジェクトを次のように追加します。
primaryStage.setScene(scene);

ステップ10：ステージのコンテンツを表示する

次のように Stage クラスの* show（）*という名前のメソッドを使用して、シーンのコンテンツを表示します。 

primaryStage.show();

ステップ11：アプリケーションの起動

次のように、メインメソッドから Application クラスの* launch（）*静的メソッドを呼び出して、JavaFXアプリケーションを起動します。 

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

例

次の表は、1750年から2050年までのさまざまな大陸の人口を示しています。

Asia Africa Europe 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

以下は、JavaFXを使用して上記のデータを表す積み上げ面グラフを生成するJavaプログラムです。

このコードを 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);
   }
}

次のコマンドを使用して、コマンドプロンプトから保存したJavaファイルをコンパイルして実行します。 

javac StackedAreaChartExample.java
java StackedAreaChartExample

実行すると、上記のプログラムは、以下に示すような積み上げ面グラフを表示するJavaFXウィンドウを生成します。

スタック領域の例

「https://www.finddevguides.com/index.php?title=Javafx-stacked-area-chart&oldid=10220」から取得
Powered by MediaWiki