如何在 JavaFX 2.0 折线图中动态更改线型? [英] How to dynamically change line style in JavaFX 2.0 line chart?

查看:57
本文介绍了如何在 JavaFX 2.0 折线图中动态更改线型?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我们的 JavaFX 项目中,我们需要一个折线图.我可以使用 CSS 轻松地对整个图表和系列进行样式化,但我们图表的内容可以动态更改:

In our JavaFX project we need a line chart. I can easy stylize the whole chart and series using CSS, but content of our chart can change dynamically:

  1. 系列的数量及其显示顺序取决于用户的操作和他的数据.每个系列代表一个具体的数据类别,每个类别都有自己的风格,例如.类别 A 显示为虚线,类别 B 显示为虚线.图表可以包含每个类别的 0 个或多个系列,

  1. number of series and their displaying order depends on user actions and his data. Each series represents a concrete data category and the each category has its own style, eg. category A is shown as a dotted line and category B is shown as a dashed line. The chart can contain 0 or more series for each category,

系列的样式也取决于数据值,例如.平均值上方的系列线为红色,下方为蓝色.

style of series depends on data values too, eg. series line over the average is red, and below is blue.

如何在 JavaFX 中实现?

How to do it in JavaFX?

推荐答案

  1. 系列的数量及其显示顺序取决于用户的操作和他的数据.

可以通过更改ObservableList 您传递给图表的 setData() 调用.当图表侦听列表的更改时,随着支持列表的更改,图表会自动更新以反映更改.

The number of series displayed and the display order can be modified by changing the ObservableList of series which you passed to the chart's setData() call. As the chart listens for changes to the list, as the backing list changes, the chart is automatically updated to reflect the changes.

每个类别都有自己的风格,例如.类别 A 显示为虚线,类别 B 显示为虚线.

each category has its own style, eg. category A is shown as a dotted line and category B is shown as a dashed line.

这可以通过确定图表中的哪个系列属于哪个类别来完成,通过节点lookupAll(cssStyleSelector) 函数并将新的自定义样式应用于与类别样式匹配的系列.通过设置 -fx-stroke-dash-array css 属性,可以通过 css 设置虚线和虚线的样式.或者,您可以通过修改从 getStyleClass().

This can done by determining which series in the chart is in which category, looking up all nodes related to the series via the node lookupAll(cssStyleSelector) function and applying a new custom style to the series which matches the style for the category. Dotted and dashed lines can be styled via css by setting the -fx-stroke-dash-array css property. Alternately, rather than a lookup you can dynamically change the css styleclass assigned to nodes via modifying the ObservableList returned from getStyleClass().

系列的样式也取决于数据值,例如.平均值上方的系列线为红色,下方为蓝色.

style of series depends on data values too, eg. series line over the average is red, and below is blue.

这与点划线的显示方式类似,但线条的颜色由 -fx-stroke css 属性修改,修改取决于计算的平均值系列.

This is similar to how the dotted and dashed lines are displayed, but instead the color of the lines are modifed by the -fx-stroke css property and the modification depends on the average values calculated for the series.

为了演示以上几点,我在这里为这个问题创建了一个示例解决方案:https://gist.github.com/2129306

To demonstrate the above points, I created a sample solution for this question here: https://gist.github.com/2129306

这篇关于如何在 JavaFX 2.0 折线图中动态更改线型?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆