Как динамически изменить стиль линий в линейном графике JavaFX 2.0? - PullRequest
9 голосов
/ 18 марта 2012

В нашем проекте JavaFX нам нужен линейный график.Я могу легко стилизовать весь график и серию с помощью CSS, но содержимое нашего графика может динамически меняться:

  1. количество серий и порядок их отображения зависит от действий пользователя и его данных.Каждая серия представляет конкретную категорию данных, и каждая категория имеет свой собственный стиль, например.категория A показана пунктирной линией, а категория B - пунктирной линией.Диаграмма может содержать 0 или более рядов для каждой категории, стиль серий

  2. также зависит от значений данных, например.Линия над средней линией красная, а ниже синяя.

Как это сделать в JavaFX?

Ответы [ 2 ]

9 голосов
/ 21 марта 2012
  1. Количество серий и порядок их отображения зависит от действий пользователя и его данных.

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

каждая категория имеет свой стиль, например. категория A показана пунктирной линией, а категория B - пунктирной линией.

Это можно сделать, определив, какая серия в диаграмме относится к какой категории, отыскивая все узлы, связанные с рядом, с помощью функции узла lookupAll (cssStyleSelector) и применяя новый пользовательский стиль для ряда, который соответствует стилю для категории. Пунктирные и пунктирные линии можно стилизовать с помощью css, установив свойство -fx-stroke-dash-array css. С другой стороны, вместо поиска вы можете динамически изменять класс стилей CSS, назначенный узлам, путем изменения ObservableList, возвращаемого из getStyleClass () .

Стиль серии

также зависит от значений данных, например. Линия над средней линией красная, а ниже синяя.

Это похоже на то, как отображаются пунктирные и пунктирные линии, но вместо этого цвет линий изменяется свойством -fx-stroke css, и модификация зависит от средних значений, рассчитанных для серии.

Чтобы продемонстрировать вышеизложенное, я создал пример решения этого вопроса здесь: https://gist.github.com/2129306

4 голосов
/ 17 января 2014

Я сделал это так, подумал, что это очень удобно. Примечание. Это, очевидно, работает на LineCharts, но не на ScatterCharts.

 Series<Number, Number> series = new Series<>();
 ...
 series.nodeProperty().get().setStyle("-fx-stroke-width: 1px;");
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...