Как установить определенный цвет для JavaFX XYChart.Серии?

Я пытаюсь создать свой JavaFX linechart, но не могу найти способ установить цвет для определенной серии. Я знаю, что могу стилизовать через CSS, но я не могу найти, как установить ID или класс в мою серию.

может кто-нибудь дать мне подсказку о:

  1. Как установить цвет для linecharts?
  2. Как установить класс css в series?
7
javafx-2

4 ответов

в целом предпочтительный способ построения диаграмм без кода, используя только таблицы стилей css, как рекомендует jschoen. Кроме того, если требуется дополнительная настройка, вы можете использовать CSS-запросы из кода, чтобы копаться в узлах, созданных из данных серии, и применять различные дополнительные стили css.

вот информация о динамическом изменении a JavaFX стиль линейной диаграммы и пример программы пойти с ответом. В примере приложения, все дополнительный стиль css выполняется с помощью вызова setStyle из кода. Используя аналогичный метод поиска, вы можете получить доступ к узлам серии, чтобы применить соответствующий stylesheet styleclass, а не вызов setStyle.

13

Как установить цвет для linecharts?

вот простой способ AreaChart или LineChart

XYChart chart = new AreaChart();
Series series = new Series();
chart.getData().add(series);

Node fill = series.getNode().lookup(".chart-series-area-fill"); // only for AreaChart
Node line = series.getNode().lookup(".chart-series-area-line");

Color color = Color.RED; // or any other color

String rgb = String.format("%d, %d, %d",
        (int) (color.getRed() * 255),
        (int) (color.getGreen() * 255),
        (int) (color.getBlue() * 255));

fill.setStyle("-fx-fill: rgba(" + rgb + ", 0.15);");
line.setStyle("-fx-stroke: rgba(" + rgb + ", 1.0);");
5

Я нашел этот документ Oracle на таблицы стилей с CSS и на этой странице прокрутите вниз, чтобы Setting Chart Colors для того, что вы конкретно ищете.

Как установить цвет для linecharts?

самый простой способ для этого следующий код в CSS:

.default-color0.chart-series-line { -fx-stroke: #e9967a; }
.default-color1.chart-series-line { -fx-stroke: #f0e68c; }
.default-color2.chart-series-line { -fx-stroke: #dda0dd; }

это, к сожалению, не будет работать по id или какой серии, а скорее порядок серии помещаются в график. Вы также можете установить стили линии делать:

.chart-series-line {    
    -fx-stroke-width: 2px;
    -fx-effect: null;
}

Как установить класс css в series?

к сожалению я не вижу способа это сделать. Было бы неплохо иметь возможность создавать правила CSS на основе XYChart.Свойство имени серии, но я не думаю, что это возможно.

4

ответ jewelsea, похоже, гласит, что вы должны поместить класс стиля на каждый узел серии. Я использую следующий код для стиля серии диаграммы областей и назначаю класс только узлу, связанному с серией. Пример кода находится в Scala, но должен быть легко переведен.

при создании серии я добавляю класс стиля, специфичный для серии:

        val s = new XYChart.Series[Number, Number]()   //create a new series
        s.setName(seriesName)                          //set its name (display in legend)
        s.getNode.getStyleClass.add("series-" + seriesName)  //add specific style class

затем внутри css - file я делаю следующее, чтобы изменить цвет заливки серии "butterwings":

.series-butterwings *.chart-series-area-fill{
    -fx-fill: #aab597; 
}

это работает, потому что узел для области серии находится ниже узла серии (который является группой в случае диаграммы области).

2