java fx custom selector on charts

Question

I have some StackedBarChart containing various series.

StackedBarChart.Series<String, Number> series1= new StackedBarChart.Series<String, Number>(
                FXCollections.observableArrayList(list1));
StackedBarChart.Series<String, Number> series2= new StackedBarChart.Series<String, Number>(
                FXCollections.observableArrayList(list2));
StackedBarChart.Series<String, Number> series3= new StackedBarChart.Series<String, Number>(
                FXCollections.observableArrayList(list3));
ObservableList<StackedBarChart.Series<String, Number>> barChartData = FXCollections
                .observableArrayList(series1, series2,
                        series3);
        final StackedBarChart<String, Number> chart = new StackedBarChart<String, Number>(
                xAxis, yAxis, barChartData);

I'd like to change the default colors of the series. So I added a custom CSS stylesheet

chart.getStylesheets().add("path to the CSS file");

In the CSS file I can override the default color with sth like

.default-color0 {
    -fx-bar-fill: limegreen;
}
.default-color1 {
    -fx-bar-fill: orange;
}
.default-color2 {
    -fx-bar-fill: tomato;
}

This works perfectly but it only replaces the default colors by my colors. If I change the orders of the series when I add them to the chart, they will switch their colors.

I'd like to be more precise in my CSS with sth like

.series1.color {
    -fx-bar-fill: limegreen;
}
.series2.color {
    -fx-bar-fill: orange;
}
.series2.color {
    -fx-bar-fill: tomato;
}

and add these custom selectors directly to the series instead of feeding the chart with the CSS stylesheet. I know there are custom selectors that you can set on Nodes with the setId(..) method, but I couldn't manage do it.

I also know about the lookup method, but I find it not elegant at all since you have to call it after the chart has been rendered (and therefore you can see the colors blinking very quickly between the original colors and the new ones)

So my question is : How can I define CSS selectors like

.series1.color {
    -fx-bar-fill: limegreen;
}
.series2.color {
    -fx-bar-fill: orange;
}
.series2.color {
    -fx-bar-fill: tomato;
}

and apply them programmatically to the chart series I want

series1.applySelector(".series1.color");

so that even if the series are inserted with a different order in the chart, they still get the color I want

Answer 1

You can set the style straight to the component, without editing the CSS:

series1.getNode().setStyle("-fx-bar-fill: limegreen;");
series2.getNode().setStyle("-fx-bar-fill: orange;");
series3.getNode().setStyle("-fx-bar-fill: tomato;");

Or you can define an id in CSS and set the CSS id for the java compoenten:

CSS

#clr1 {
    -fx-bar-fill: limegreen;    
}
#clr2 {
    -fx-bar-fill: orange;   
}
#clr3 {
    -fx-bar-fill: tomato;   
}

Java

series1.getNode().setId("clr1");
series2.getNode().setId("clr2");
series3.getNode().setId("clr3");