JavaFX BarChart doesn't update

Question

I have the following Controller for my window:

package window;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.chart.BarChart;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;

import java.util.Map;
import java.util.SortedMap;

public class StatisticsController {

    @FXML
    private BarChart<String, Number> barChartHistogram;

    private SortedMap<String, Integer> _points;

    final CategoryAxis xAxis = new CategoryAxis();
    final NumberAxis yAxis = new NumberAxis();

    public void onLoad(SortedMap<String, Integer> points) {
        barChartHistogram = new BarChart<String, Number>(xAxis,yAxis);
        barChartHistogram.setCategoryGap(0);
        barChartHistogram.setBarGap(0);
        xAxis.setLabel("Numer indeksu");
        yAxis.setLabel("Ilość punktów");
        XYChart.Series series = new XYChart.Series();
        series.setName("Histogram");
        for (Map.Entry<String, Integer> p: points.entrySet()) {
            series.getData().add(new XYChart.Data(p.getKey(), p.getValue()));
        }
        barChartHistogram.getData().addAll(series);
        _points = points;
    }

    @FXML
    private void buttonShowPressed(ActionEvent event) {
        xAxis.setLabel("Numer indeksu");
        yAxis.setLabel("Ilość punktów");
        barChartHistogram = new BarChart<String, Number>(xAxis,yAxis);
        barChartHistogram.setCategoryGap(0);
        barChartHistogram.setBarGap(0);
        barChartHistogram.setTitle("XDDDDDDDDDDDDDDD");
        barChartHistogram.setMaxHeight(1000);
        XYChart.Series series = new XYChart.Series();
        series.setName("Histogram");
        for (Map.Entry<String, Integer> p: _points.entrySet()) {
            series.getData().add(new XYChart.Data(p.getKey(), p.getValue()));
        }
        barChartHistogram.getData().addAll(series);
    }
}

The .fxml file for this window:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.chart.BarChart?>
<?import javafx.scene.chart.CategoryAxis?>
<?import javafx.scene.chart.NumberAxis?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.AnchorPane?>


<AnchorPane prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/9.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="window.StatisticsController">
   <children>
      <BarChart fx:id="barChartHistogram" layoutX="40.0" layoutY="14.0" prefHeight="372.0" prefWidth="500.0">
        <xAxis>
          <CategoryAxis side="BOTTOM" />
        </xAxis>
        <yAxis>
          <NumberAxis side="LEFT" />
        </yAxis>
      </BarChart>
      <Button fx:id="buttonShow" layoutY="337.0" mnemonicParsing="false" onAction="#buttonShowPressed" text="Button" />
   </children>
</AnchorPane>

Now the problem is when I press the button, nothing changes ( onLoad() method is here for testing the onLoad C#-like behaviour). The bar chart stays the same without data, labels or title (I checked the data in the debugger, the barCharHistogram object has my data under its data property). Am I doing something stupidly wrong? How can I make it like redraw the barchart?

Answer 1

You already define everything you need in the FXML. You should not be creating a new chart, or new axes, in the controller.

Add fx:id s to the axes:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.chart.BarChart?>
<?import javafx.scene.chart.CategoryAxis?>
<?import javafx.scene.chart.NumberAxis?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.AnchorPane?>


<AnchorPane prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/9.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="window.StatisticsController">
   <children>
      <BarChart fx:id="barChartHistogram" layoutX="40.0" layoutY="14.0" prefHeight="372.0" prefWidth="500.0">
        <xAxis>
          <CategoryAxis fx:id="xAxis" side="BOTTOM" />
        </xAxis>
        <yAxis>
          <NumberAxis fx:d="yAxis" side="LEFT" />
        </yAxis>
      </BarChart>
      <Button fx:id="buttonShow" layoutY="337.0" mnemonicParsing="false" onAction="#buttonShowPressed" text="Button" />
   </children>
</AnchorPane>

and then you can do

public class StatisticsController {

    @FXML
    private BarChart<String, Number> barChartHistogram;

    private SortedMap<String, Integer> _points;

    @FXML
    private CategoryAxis xAxis ;
    @FXML
    private NumberAxis yAxis ;


    @FXML
    private void buttonShowPressed(ActionEvent event) {
        xAxis.setLabel("Numer indeksu");
        yAxis.setLabel("Ilość punktów");
        barChartHistogram.setCategoryGap(0);
        barChartHistogram.setBarGap(0);
        barChartHistogram.setTitle("XDDDDDDDDDDDDDDD");
        barChartHistogram.setMaxHeight(1000);
        XYChart.Series series = new XYChart.Series();
        series.setName("Histogram");
        for (Map.Entry<String, Integer> p: _points.entrySet()) {
            series.getData().add(new XYChart.Data(p.getKey(), p.getValue()));
        }
        barChartHistogram.getData().addAll(series);
    }
}