【JavaFX】円グラフを表示・イベントを登録する方法(PieChart)

JavaFXで円グラフを表示・イベントを登録する方法について記載します。

円グラフを表示・イベントを登録する方法

円グラフを表示するには、PieChartクラスを使用します。

次のような円グラフを作成することが出来ます。

実行例

1. 円グラフに表示するデータを定義

円グラフに表示するデータは、ObservableList<PieChart.Data>型の変数に格納します。
addメソッドを使用してデータを追加します。

ObservableList<PieChart.Data> chartData = FXCollections.observableArrayList();
chartData.add(new PieChart.Data(“りんご”, 20));
chartData.add(new PieChart.Data(“もも”, 30));
chartData.add(new PieChart.Data(“ぶどう”, 25));
chartData.add(new PieChart.Data(“なし”, 15));
chartData.add(new PieChart.Data(“パイナップル”, 10));

2. 円グラフに表示するデータをソートする

ObservableList<PieChart.Data>型の変数にaddする際に、昇順・降順になるようにデータを追加している場合は必要ありませんが、順序を気にせず追加した場合、sortメソッドを使用することで並び替えることが出来ます。

今回は、降順にしましたが昇順にする場合は、次のようにします。

// データの昇順に表示されるようにデータをソート
chartData.sort( (a, b) -> (int)(a.getPieValue() – b.getPieValue()) );

3. 円グラフの定義

円グラフを定義するには、PieChartクラスのインスタンスを生成します。

// 円グラフの定義
final PieChart chart = new PieChart(chartData);
chart.setTitle(“売上データ”); // グラフのタイトルを設定
chart.setStartAngle(90); // 90度の位置からデータが表示されるようにする

また、setStartAngleメソッドを使用するとグラフの開始位置を選択できます。
設定しない場合、0度から開始されます。

次の例は、0度から開始(左)と90度から開始(右)の例です。

個人的には、90度から開始(左)の方が見やすいです。

4. 円グラフの各データにイベントを登録する

イベントを登録するには、addEventHandlerメソッドを使用します。

また、マウスイベントを登録するには、MouseEventクラスを使用します。
今回は次の2つのイベントを使用しました。
MouseEvent.MOUSE_CLICKED:マウスクリック時のイベント
MouseEvent.MOUSE_EXITED:データから外れた時のイベント

スポンサーリンク

シェアする

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

フォローする