Live update Pie Chart

Question

I want to create very useful and easy way to live update Pie chart. For example:

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.EventHandler;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.chart.PieChart;
import javafx.scene.control.Label;
import javafx.scene.input.MouseEvent;
import javafx.scene.paint.Color;
import javafx.stage.Stage;


public class MainApp extends Application {

    @Override
    public void start(Stage stage) {
        Scene scene = new Scene(new Group());
        stage.setTitle("Imported Fruits");
        stage.setWidth(500);
        stage.setHeight(500);

        ObservableList<PieChart.Data> pieChartData =
                FXCollections.observableArrayList(
                new PieChart.Data("Grapefruit", 13),
                new PieChart.Data("Oranges", 25),
                new PieChart.Data("Plums", 10),
                new PieChart.Data("Pears", 22),
                new PieChart.Data("Apples", 30));

        final PieChart chart = new PieChart(pieChartData);
        chart.setTitle("Imported Fruits");
        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())
                                + "%");
                        }
                    });
        }

        ((Group) scene.getRoot()).getChildren().addAll(chart, caption);
        stage.setScene(scene);
        stage.show();
    }

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

When I display the chart I want to call Java Method and update the chart like this:

PieChartUpdate(valueOne, valueTwo, valueThree);

Can you show me how I can edit the code in order to make the live updates more easy to use?

Answer 1

As far as i could see, all classes that are used to establish a PieChart, like PieChart.Data and of course the ObservableList are already designed so that they will update the PieChart the moment something changes, be it the list itself or values inside the Data Objects. See the binding chapters how this is done. But you don't need to write your own bindings for the PieChart.

The code below should do what you want. Use addData(String name, double value) to create a new Data object for your pie chart, or update an existing one which has the same name like the first parameter of the method. The PieChart will automatically play a animation when changes are made to the list (new Data object added) or a Data object got changed.

 //adds new Data to the list
public void naiveAddData(String name, double value)
{
    pieChartData.add(new Data(name, value));
}

//updates existing Data-Object if name matches
public void addData(String name, double value)
{
    for(Data d : pieChartData)
    {
        if(d.getName().equals(name))
        {
            d.setPieValue(value);
            return;
        }
    }
    naiveAddData(name, value);
}

Answer 2

Just in case someone feels extremely lost and isn't sure how to implement denhackl's answer, here is a working version of what he tried to explain.

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.EventHandler;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.chart.PieChart;
import javafx.scene.control.Label;
import javafx.scene.input.MouseEvent;
import javafx.scene.paint.Color;
import javafx.stage.Stage;


public class LivePie extends Application {

    ObservableList<PieChart.Data> pieChartData;

    @Override
    public void start(Stage stage) {
        Scene scene = new Scene(new Group());
        stage.setTitle("Imported Fruits");
        stage.setWidth(500);
        stage.setHeight(500);

       this.pieChartData =
                FXCollections.observableArrayList();

       addData("Test", 5.1);
       addData("Test2", 15.1);
       addData("Test3", 3.1);
       addData("Test1", 4.9);
       addData("Test2", 15.1);
       addData("Test3", 2.1);
       addData("Test5", 20.1);


        final PieChart chart = new PieChart(pieChartData);
        chart.setTitle("Imported Fruits");
        final Label caption = new Label("");
        caption.setTextFill(Color.DARKORANGE);
        caption.setStyle("-fx-font: 24 arial;");



        ((Group) scene.getRoot()).getChildren().addAll(chart, caption);
        stage.setScene(scene);
        stage.show();
    }

    public void naiveAddData(String name, double value)
    {
        pieChartData.add(new javafx.scene.chart.PieChart.Data(name, value));
    }

    //updates existing Data-Object if name matches
    public void addData(String name, double value)
    {
        for(javafx.scene.chart.PieChart.Data d : pieChartData)
        {
            if(d.getName().equals(name))
            {
                d.setPieValue(value);
                return;
            }
        }
        naiveAddData(name, value);
    }

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


}

Many thanks to the creator of the topic and the answers provided!

Answer 3

Here's a good introductory article on using properties and binding.

http://docs.oracle.com/javafx/2/binding/jfxpub-binding.htm