31 饼图
本章介绍一种以圆形划分成三角形楔形块(称为切片)来表示数据的图表。每个切片表示对应特定值的百分比。
图31-1显示了使用PieChart类创建的饼图。切片的颜色由添加到PieChart.Data数组的相应数据项的顺序定义。
创建饼图
在JavaFX应用程序中创建饼图,至少需要实例化PieChart类,定义数据,将数据项分配给PieChart对象,并将图表添加到应用程序中。在创建图表数据时,为要显示的每个扇区定义尽可能多的PieChart.Data对象。每个PieChart.Data对象有两个字段:饼图扇区的名称和对应的值。示例31-1创建了基本的饼图。
示例31-1 创建饼图
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.chart.*;
import javafx.scene.Group;
public class PieChartSample extends Application {
@Override public void start(Stage stage) {
Scene scene = new Scene(new Group());
stage.setTitle("进口水果");
stage.setWidth(500);
stage.setHeight(500);
ObservableList<PieChart.Data> pieChartData =
FXCollections.observableArrayList(
new PieChart.Data("葡萄柚", 13),
new PieChart.Data("橙子", 25),
new PieChart.Data("李子", 10),
new PieChart.Data("梨子", 22),
new PieChart.Data("苹果", 30));
final PieChart chart = new PieChart(pieChartData);
chart.setTitle("进口水果");
((Group) scene.getRoot()).getChildren().add(chart);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}
编译和运行此应用程序的结果如图31-2所示。
除了基本设置外,示例31-1通过调用setTitle方法指定了图表的标题。
设置饼图和图例
饼图的默认视图包括饼图、标签和图例。标签的值是从PieChart.Data对象的name字段中获取的。您可以使用setLabelsVisible方法来管理标签的外观。同样,您可以通过调用setLegendVisible方法来管理图例的外观。
您可以改变标签和图例的位置。使用setLabelLineLength方法,您可以指定饼图周长和标签之间的线的长度。使用setLegendSide方法来改变图例相对于饼图的默认位置。在示例31-2中演示了如何将这些方法应用于示例31-1中创建的图表。
将这些代码添加到应用程序中,编译并运行后的结果如图31-3所示。
您的应用程序可能需要改变饼图中切片的放置方向。默认情况下,切片是顺时针放置的。但是,您可以通过为setClockwise方法指定false值来改变这一点chart.setClockwise(false)。结合使用setStartAngle方法,可以实现切片的所需位置。图31-4展示了当为chart对象调用setStartAngle(180)方法时,饼图的外观如何改变。
处理饼图的事件
虽然饼图的切片不是一个Node对象,但是每个PieChart.Data元素都有一个与之关联的节点,可以用来分析事件并相应地处理它们。在示例31-3中显示的代码片段创建了一个EventHandler对象,用于处理落入特定图表切片的MOUSE_PRESSED事件。
示例31-3 处理饼图的鼠标事件
final Label caption = new Label("");
caption.setTextFill(Color.DARKORANGE);
caption.setStyle("-fx-font: 24 arial;");
for (final PieChart.Data data : chart.getData()) {
data.getNode().addEventHandler(MouseEvent.MOUSE_PRESSED,
new EventHandler<MouseEvent>() {
@Override public void handle(MouseEvent e) {
caption.setTranslateX(e.getSceneX());
caption.setTranslateY(e.getSceneY());
caption.setText(String.valueOf(data.getPieValue()) + "%");
}
});
}
当您将此代码片段添加到应用程序代码中并编译运行时,应用程序开始对鼠标点击做出反应。在图31-5中,当用户点击相应的切片时,显示了梨的值。
通过使用这种编码模式,您可以处理各种事件或将视觉效果应用于整个图表以及其切片。
相关API文档

