【JavaFX】折れ線グラフを作成・表示する方法(LineChart)

JavaFXで折れ線グラフを作成・表示する方法について記載します。

1. 折れ線グラフを作成・表示する方法(X・Y軸とも数値データ)

折れ線グラフを作成するには、LineChartクラスを使用します。

実行例

1. 軸の定義

数値データを使用する場合は、NumberAxisクラス のインスタンスを作成します。

2. LineChartクラスの生成

LineChartクラスのインスタンス生成時に、X・Y軸のインスタンスをコンストラクタの引数に渡します。

また、今回はX・Y軸ともに数値なのでジェネリクスは、<Number,Number> と指定しています。

3. グラフに表示するデータ

表示するデータは、系列データごとに、XYChart.Seriesクラスのインスタンスを作成して追加します。

2. 折れ線グラフを作成・表示する方法(X軸:文字、Y軸:数値)

次の例では、X軸に文字データ、Y軸に数値データを設定する折れ線グラフを作成・表示します。

実行例

1. 軸の定義

X軸は文字データなので、CategoryAxisクラスのインスタンスを、Y軸は数値データを使用するので、NumberAxisクラスのインスタンスを生成して軸を定義します。

2. LineChartクラスの生成

LineChartクラスのインスタンス生成時に、X・Y軸のインスタンスをコンストラクタの引数に渡します。

また、今回はX軸は文字、Y軸は数値なのでジェネリクスは、<String,Number> と指定しています。

3. グラフに表示するデータ

表示するデータは、系列データごとに、XYChart.Seriesクラスのインスタンスを作成して追加します。

3. その他

1. X軸・Y軸の位置を変更する方法

X軸の位置の初期値はBottom、Y軸の位置の初期値はLeftになっています。
次の例では、X軸の位置をTop、Y軸の位置をRight に変更しています。

実行例

軸の位置を変更するには、setSideメソッドの引数に軸の位置を指定します。

2. グラフの線の色を変える方法

線の色を変更するには、ノードを指定してCSSを使って変更します。

実行例

Platform.runLater の処理で系列ごとにグラフの線の色を変更します。

3. グラフの値をツールチップに表示する方法

グラフにマウスポインタを当てたタイミングで、ツールチップに値を表示します。

実行例

各データのツールチップを表示するには、系列ごとの各データに、OnMouseEntered、 OnMouseExited イベントを登録します。

4. グラフ一覧

棒グラフを作成・表示する方法

積み上げ棒グラフを作成・表示する方法

折れ線グラフを作成・表示する方法

円グラフを作成・表示する方法

散布図を作成・表示する方法

面グラフを作成・表示する方法<

バブルチャートを作成・表示する方法

スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする