JavaFX 2.x : How to Remove XY Line Chart once plotted?

Question

I have a simple serie plotted on a XY Line Chart as below

public class SimpleXYLineChart extends Application {

@Override
public void start(Stage stage) {        
   stage.setTitle("Line plot");       

   final CategoryAxis xAxis = new CategoryAxis();
   final NumberAxis yAxis = new NumberAxis(1, 22, 0.5);

   yAxis.setTickLabelFormatter(new NumberAxis.DefaultFormatter(yAxis){
        @Override
    public String toString(Number object){
        return String.format("%7.2f", object);
    }
});
    final LineChart<String, Number>lineChart = new LineChart<String, Number>(xAxis, yAxis);

    lineChart.setCreateSymbols(false);
    lineChart.setAlternativeRowFillVisible(false);
    lineChart.setLegendVisible(false);
    lineChart.setTitle("LineChart");

    XYChart.Series series1 = new XYChart.Series();

    series1.getData().add(new XYChart.Data("Jan", 1));
    series1.getData().add(new XYChart.Data("Feb", 1.5));
    series1.getData().add(new XYChart.Data("Mar", 2));
    series1.getData().add(new XYChart.Data("Apr", 2.5));
    series1.getData().add(new XYChart.Data("May", 3));
    series1.getData().add(new XYChart.Data("Jun", 4));
    series1.getData().add(new XYChart.Data("Jul", 6));
    series1.getData().add(new XYChart.Data("Aug", 9));
    series1.getData().add(new XYChart.Data("Sep", 12));
    series1.getData().add(new XYChart.Data("Oct", 15));
    series1.getData().add(new XYChart.Data("Nov", 20));
    series1.getData().add(new XYChart.Data("Dec", 22));

    lineChart.getData().addAll(series1);        

    Scene scene = new Scene(new Group(), 800, 600);
    final VBox vbox = new VBox();
    final HBox hbox = new HBox();

    final Button remove = new Button("Remove Series");
    remove.setOnAction(new EventHandler<ActionEvent>() {
        @Override public void handle(ActionEvent e) {
    if (!lineChart.getData().isEmpty()){ 
        System.out.println("Remove Series");
        lineChart.getData().remove((lineChart.getData().size()-1),0);
        }
    }
    });                

    hbox.setSpacing(10);
    hbox.getChildren().addAll(remove);

    vbox.getChildren().addAll(lineChart, hbox);
    hbox.setPadding(new Insets(10, 10, 10, 50));

    ((Group)scene.getRoot()).getChildren().add(vbox);
    stage.setScene(scene);
    stage.show();
}

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

}

I would like to remove the line plotted (by clicking on a button or by flagging a checkBox) and have the empty scene as below

I do not know how to remove the Line once plotted, haven't found any .remove() or .delete() methods.

How to accomplish this?

Thanks

Answer 1

The problem is now solved, it seems it is a bug of JavaFX.

I have solved by adding

lineChart.setAnimated(false); and it all works fine. In JIRA Kenai it has been proposed as bug by commenting lineChart.setCreateSymbols(false);

This also works but I think it is not the right answer, I can use .setCreateSymbols(false) or (true) having setted setAnimated(false);

Answer 2

I faced the same problem and made a workaround. To give an overview, I manage a ArrayList with all series. Everytime one of the series should be removed from the chart, I search for it in the ArrayList and clear the data of that series(clearing, not deleting, the data is important to keep the color).

final ArrayList<XYChart.Series> serieslist = new ArrayList<>();

--removing--

if(series to remove found){

serieslist.get(i).getData().clear();
addSeries(serieslist);

}

--adding--

XYChart.Series series = new XYChart.Series();
series.getData().add(SERIESDATA);

if(series to add found at i in serieslist){

serieslist.set(i, series);
addSeries(serieslist);

}
else {
serieslist.add(series);
addSeries(serieslist);
}

--method addSeries--

addSeries(ArrayList<XYChart.Series> serieslist) {

chart.getData().clear();

for (int i = 0; i < serieslist.size(); i++) {

            chart.getData().add(serieslist.get(i));
        }
    }

I hope this is what you were looking for.

EDIT: One problem is still not solved. When I remove a series from the chart, the name/description of this series stays visible in the legend. My solution is to disable the legend and to color the button where I decide to show/remove the series in the corresponding color. The color can be extracted from the default stylesheet for linecharts (caspian.css). It only defines 8 colours for series. For convenience here they are:

.default-color0.chart-series-line { -fx-stroke: #f9d900; }
.default-color1.chart-series-line { -fx-stroke: #a9e200; }
.default-color2.chart-series-line { -fx-stroke: #22bad9; }
.default-color3.chart-series-line { -fx-stroke: #0181e2; }
.default-color4.chart-series-line { -fx-stroke: #2f357f; }
.default-color5.chart-series-line { -fx-stroke: #860061; }
.default-color6.chart-series-line { -fx-stroke: #c62b00; }
.default-color7.chart-series-line { -fx-stroke: #ff5700; }

Answer 3

Your series is an ObservableList, you can do whatever you want with that list and it will be reflected.

E.g., in your case:

    series1.getData().clear();