如何向JavaFX图表添加值标记？ [英] How to add a value marker to JavaFX chart?

问题描述

我试图使用JavaFX构建一个系列图表，其中数据是动态插入的。

I am trying to build a series chart using JavaFX, where data is inserted dynamically.

每次插入一个新值时，我想检查这是否是迄今为止的最高值，如果是，我想绘制一条水平线这是最大的值。

Each time that a new value is inserted I would like to check if this is the highest value so far, and if so, I want to draw an horizontal line to show that this is the maximum value.

在JFree图表中，我将使用一个ValueMarker，但我想对JavaFX做同样的事。

In JFree chart I would have used a ValueMarker, but I am trying to do the same with JavaFX.

我试过使用Line对象，但它是绝对不一样，因为我不能提供图表值，它需要在窗口中的相对像素位置。

I tried using the Line object, but it is definitely not the same, because I cannot provide the Chart values, it takes the relative pixel positions in the windows.

这是我想要实现的图表的屏幕截图：

Here is the screenshot of chart I want to achieve:

http://postimg.org/image/s5fkupsuz/

有任何建议吗？
谢谢。

Any suggestions? Thank you.

推荐答案

要将图表值转换为像素，您可以使用方法 NumberAxis＃ getDisplayPosition（），返回图表节点的实际坐标。

To convert chart values to pixels you can use method NumberAxis#getDisplayPosition() which return actual coordinates of the chart nodes.

虽然这些坐标是相对于图表区域的，代码：

Although these coordinates are relative to chart area, which you can find out by next code:

Node chartArea = chart.lookup(".chart-plot-background");
Bounds chartAreaBounds = chartArea.localToScene(chartArea.getBoundsInLocal());

注意 localToScene（）将任何坐标转换为场景。因此，您可以使用它们来更新您的值标记坐标。

Note localToScene() method which allows you to convert any coordinates to Scene ones. Thus you can use them to update your value marker coordinates. Make sure you make localToScene call after your Scene have been shown.

请参阅下面的示例程序，生成下一个图表： localToScene

See sample program below which produces next chart:

>

public class LineChartValueMarker extends Application {

    private Line valueMarker = new Line();
    private XYChart.Series<Number, Number> series = new XYChart.Series<>();
    private NumberAxis yAxis;
    private double yShift;

    private void updateMarker() {
        // find maximal y value
        double max = 0;
        for (Data<Number, Number> value : series.getData()) {
            double y = value.getYValue().doubleValue();
            if (y > max) {
                max = y;
            }
        }
        // find pixel position of that value
        double displayPosition = yAxis.getDisplayPosition(max);
        // update marker
        valueMarker.setStartY(yShift + displayPosition);
        valueMarker.setEndY(yShift + displayPosition);
    }

    @Override
    public void start(Stage stage) {
        LineChart<Number, Number> chart = new LineChart<>(new NumberAxis(0, 100, 10), yAxis = new NumberAxis(0, 100, 10));

        series.getData().add(new XYChart.Data(0, 0));
        series.getData().add(new XYChart.Data(10, 20));

        chart.getData().addAll(series);
        Pane pane = new Pane();
        pane.getChildren().addAll(chart, valueMarker);
        Scene scene = new Scene(pane);

        // add new value on mouseclick for testing
        chart.setOnMouseClicked(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent t) {
                series.getData().add(new XYChart.Data(series.getData().size() * 10, 30 + 50 * new Random().nextDouble()));
                updateMarker();
            }
        });

        stage.setScene(scene);
        stage.show();

        // find chart area Node
        Node chartArea = chart.lookup(".chart-plot-background");
        Bounds chartAreaBounds = chartArea.localToScene(chartArea.getBoundsInLocal());
        // remember scene position of chart area
        yShift = chartAreaBounds.getMinY();
        // set x parameters of the valueMarker to chart area bounds
        valueMarker.setStartX(chartAreaBounds.getMinX());
        valueMarker.setEndX(chartAreaBounds.getMaxX());
        updateMarker();
    }

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

这篇关于如何向JavaFX图表添加值标记？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！