javafx
Диаграмма

Круговая диаграмма

Класс PieChart рисует данные в виде круга, который разделен на срезы. Каждый срез представляет процент (часть) для определенного значения. Данные круговой диаграммы обернуты в объекты PieChart.Data . Каждый объект PieChart.Data имеет два поля: имя среза пирога и соответствующее ему значение.

Конструкторы

Чтобы создать круговую диаграмму, нам нужно создать объект класса PieChart . Мы даем два конструктора. Один из них создает пустую диаграмму, которая ничего не отображает, если данные не заданы с помощью метода setData :

PieChart pieChart = new PieChart(); // Creates an empty pie chart

А вторая требует, чтобы в качестве параметра был передан список ObservableList данных PieChart.Data ObservableList .

ObservableList<PieChart.Data> valueList = FXCollections.observableArrayList(
            new PieChart.Data("Cats", 50),
            new PieChart.Data("Dogs", 50));
PieChart pieChart(valueList); // Creates a chart with the given data

Данные

Значения кусочков пирога необязательно должны суммироваться до 100, так как размер среза будет рассчитываться пропорционально сумме всех значений.

Порядок, в котором записи данных будут добавлены в список, определит их позицию на графике. По умолчанию они отложены по часовой стрелке, но это поведение можно изменить:

pieChart.setClockwise(false);

пример

В следующем примере создается простая круговая диаграмма:

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.chart.PieChart;
import javafx.scene.layout.Pane;
import javafx.stage.Stage;

public class Main extends Application {

@Override
public void start(Stage primaryStage) {
    Pane root = new Pane();
    ObservableList<PieChart.Data> valueList = FXCollections.observableArrayList(
            new PieChart.Data("Android", 55),
            new PieChart.Data("IOS", 33),
            new PieChart.Data("Windows", 12));
    // create a pieChart with valueList data.
    PieChart pieChart = new PieChart(valueList);
    pieChart.setTitle("Popularity of Mobile OS");
    //adding pieChart to the root.
    root.getChildren().addAll(pieChart);
    Scene scene = new Scene(root, 450, 450);

    primaryStage.setTitle("Pie Chart Demo");
    primaryStage.setScene(scene);
    primaryStage.show();
}

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

Выход:

Интерактивная круговая диаграмма

По умолчанию PieChart не обрабатывает никаких событий, но это поведение можно изменить, потому что каждый кусочек пирога является Node JavaFX.

В приведенном ниже примере мы инициализируем данные, присваиваем их диаграмме, а затем перебираем набор данных, добавляя всплывающие подсказки к каждому фрагменту, так что значения, обычно скрытые, могут быть представлены пользователю.

ObservableList<PieChart.Data> valueList = FXCollections.observableArrayList(
            new PieChart.Data("Nitrogen", 7809),
            new PieChart.Data("Oxygen", 2195),
            new PieChart.Data("Other", 93));
    
PieChart pieChart = new PieChart(valueList);
pieChart.setTitle("Air composition");

pieChart.getData().forEach(data -> {
    String percentage = String.format("%.2f%%", (data.getPieValue() / 100));
    Tooltip toolTip = new Tooltip(percentage);
    Tooltip.install(data.getNode(), toolTip);
});

Линейный график

Класс LineChart представляет данные как ряд точек данных, связанных с прямыми линиями. Каждая точка данных завернута в объект XYChart.Data , а точки данных сгруппированы в XYChart.Series .

Каждый объект XYChart.Data имеет два поля, к которым можно получить доступ, используя getXValue и getYValue , которые соответствуют значению x и ay на диаграмме.

XYChart.Data data = new XYChart.Data(1,3);
System.out.println(data.getXValue()); // Will print 1
System.out.println(data.getYValue()); // Will print 3

Топоры

Прежде чем мы создадим LineChart нам нужно определить его оси. Например, конструктор no-argument по NumberAxis класса NumberAxis создаст ось автоматического NumberAxis которая готова к использованию и не нуждается в дальнейшей настройке.

Axis xAxis = new NumberAxis();

пример

В приведенном ниже примере мы создаем две серии данных, которые будут отображаться на одной диаграмме. Ярлыки, диапазоны и значения меток обозначены явно.

@Override
public void start(Stage primaryStage) {
    Pane root = new Pane();

    // Create empty series
    ObservableList<XYChart.Series> seriesList = FXCollections.observableArrayList();

    // Create data set for the first employee and add it to the series
    ObservableList<XYChart.Data> aList = FXCollections.observableArrayList(
            new XYChart.Data(0, 0),
            new XYChart.Data(2, 6),
            new XYChart.Data(4, 37),
            new XYChart.Data(6, 82),
            new XYChart.Data(8, 115)
    );
    seriesList.add(new XYChart.Series("Employee A", aList));

    // Create data set for the second employee and add it to the series
    ObservableList<XYChart.Data> bList = FXCollections.observableArrayList(
            new XYChart.Data(0, 0),
            new XYChart.Data(2, 43),
            new XYChart.Data(4, 51),
            new XYChart.Data(6, 64),
            new XYChart.Data(8, 92)
    );
    seriesList.add(new XYChart.Series("Employee B", bList));

    // Create axes
    Axis xAxis = new NumberAxis("Hours worked", 0, 8, 1);
    Axis yAxis = new NumberAxis("Lines written", 0, 150, 10);
    
    LineChart chart = new LineChart(xAxis, yAxis, seriesList);

    root.getChildren().add(chart);

    Scene scene = new Scene(root);
    primaryStage.setScene(scene);
    primaryStage.show();
}

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

Выход: