JavaFX StackedBarChart automatically reuse the same color on different series: how to avoid it?

Question

In JavaFx I\'m creating a a StackedBarChart with this code:

        String[] ACTIVITIES = new String[10]{ ... };// there are 10 activity names here
        f         


        

Answer 1

The colors are recycled after 8 series (the reason is that there has to be some hard-coded limit to the number of colors that are defined: the JavaFX CSS syntax simply does not provide enough syntax for computing arbitrary values, and for series beyond that limit some color needs to be defined).

To create colors for series beyond the 8th, you need to do two things: set a style class on the nodes representing the additional series, and set the style for those in CSS.

SSCCE:

import java.util.Random;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.StackedBarChart;
import javafx.scene.chart.XYChart.Data;
import javafx.scene.chart.XYChart.Series;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

public class StackedBarChartExample extends Application {

    @Override
    public void start(Stage primaryStage) {
        StackedBarChart<String, Number> chart = new StackedBarChart<>(new CategoryAxis(), new NumberAxis());

        Random rng = new Random();

        int numSeries = 10 ;
        int defaultColorsDefined = 8 ;


        for (int i = 0; i < numSeries; i++) {
            Series<String, Number> series = new Series<>();
            Data<String, Number> untreated = new Data<>("Untreated", rng.nextDouble());
            series.getData().add(untreated);
            Data<String, Number> treated = new Data<>("Treated", rng.nextDouble());
            series.getData().add(treated);
            series.setName("Series "+i);

            chart.getData().add(series);

            // add style classes for additional series beyond the default support:
            // Note this must be done after adding the series to the chart...
            if (i >= defaultColorsDefined) {
                untreated.getNode().getStyleClass().add("default-color"+i);
                treated.getNode().getStyleClass().add("default-color"+i);
            }
        }

        BorderPane root = new BorderPane(chart);
        Scene scene = new Scene(root);
        scene.getStylesheets().add("stacked-bar-chart.css");
        primaryStage.setScene(scene);
        primaryStage.show();


    }

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

And then just define some colors in css in the usual way:

.default-color8.chart-bar {
    -fx-bar-fill: black ;
}
.default-color9.chart-bar {
    -fx-bar-fill: green ;
}