从javaFX折线图中读取数据集
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了从javaFX折线图中读取数据集相关的知识,希望对你有一定的参考价值。
我在一个应用程序中使用JavaFX Linechart。我想从显示屏上读取图形的X和Y轴。我的意思是从图表。我怎样才能做到这一点?我想将值保存在ArrayList / Array中。
提前致谢。
因为我相信你的问题可能是要求你的数据的视觉坐标或用于绘制图表的真实数据,我将为两者提供答案。
真实数据
LineChart
从XYChart
延伸,有data property。此属性包含ObservableList
的XYChart.Series
。每个XYChart.Series
也有自己的data property。此属性包含ObservableList
的XYChart.Data
。每个XYChart.Data
都有一个property for its X value和一个property for its Y value。访问这些属性以获取用于绘制图形的X和Y值。
由于图表已包含您在集合中查找的数据,因此可能无需将其添加到单独的ArrayList
或数组中。
视觉坐标
XYChart
(再次LineChart
延伸)有a X axis和a Y axis。这些是Axis
类型,它提供以下方法:getDisplayPosition(Object)
。此方法将在轴上绘制的实际数据作为参数。例如,如果您绘制了点(4,16),您将获得显示位置:
- 对于X坐标:
chart.getXAxis().getDisplayPosition(4);
- 对于Y坐标:
chart.getYAxis().getDisplayPosition(16);
当使用LineChart
(很可能是其他图表,但我只用LineChart
测试它)时,这些坐标与LineChart
无关。相反,他们是相对于一个孩子Region
有一个风格类chart-plot-background
(至少在我的测试中)。这是我用来测试获取视觉坐标的代码。它从[0-10]创建一个具有指数函数的LineChart
,并将Circle
s添加到堆积在Group
顶部的LineChart
中,与绘制数据位于相同的位置。
注意:我使用了很多添加到Java 10中的var
关键字。您需要使用Java 10+来运行它,或者您需要使用显式类型替换var
关键字。
import javafx.animation.Animation;
import javafx.animation.FadeTransition;
import javafx.animation.ParallelTransition;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;
import javafx.util.Duration;
public class Main extends Application {
@Override
public void start(Stage primaryStage) {
var chart = createChart();
var group = new Group();
group.setManaged(false);
primaryStage.setOnShown(we -> addFadingCircles(group, chart));
var root = new StackPane(chart, group);
var scene = new Scene(root, 600, 400);
primaryStage.setScene(scene);
primaryStage.setTitle("Workshop");
primaryStage.setResizable(false);
primaryStage.show();
}
private LineChart<Number, Number> createChart() {
var xAxis = new NumberAxis();
xAxis.setLabel("X");
var yAxis = new NumberAxis();
yAxis.setLabel("Y");
var chart = new LineChart<>(xAxis, yAxis);
var series = new XYChart.Series<Number, Number>();
for (int x = 0; x <= 10; x++) {
series.getData().add(new XYChart.Data<>(x, Math.pow(x, 2)));
}
chart.getData().add(series);
return chart;
}
/*
* This method assumes that "group" is stacked on top of "chart" and takes up the
* same area in the scene-graph.
*/
private void addFadingCircles(Group group, LineChart<Number, Number> chart) {
var animation = new ParallelTransition();
animation.setAutoReverse(true);
animation.setCycleCount(Animation.INDEFINITE);
var plotRegion = chart.lookup(".chart-plot-background");
for (var series : chart.getData()) {
for (var data : series.getData()) {
var xPos = chart.getXAxis().getDisplayPosition(data.getXValue());
var yPos = chart.getYAxis().getDisplayPosition(data.getYValue());
var scenePoint = plotRegion.localToScene(xPos, yPos);
var groupPoint = group.sceneToLocal(scenePoint);
var circle = new Circle(groupPoint.getX(), groupPoint.getY(), 10);
circle.setFill(Color.DEEPSKYBLUE);
var fadeTrans = new FadeTransition(Duration.millis(500), circle);
fadeTrans.setFromValue(0.0);
fadeTrans.setToValue(0.8);
animation.getChildren().add(fadeTrans);
group.getChildren().add(circle);
}
}
animation.play();
}
}
运行此代码会导致:
如果你的目标是在用于表示绘制数据的Node
上添加东西,那么操纵node property的XYChart.Data
可能会更好。
以上是关于从javaFX折线图中读取数据集的主要内容,如果未能解决你的问题,请参考以下文章
有没有办法在使用 JavaScript 的 Google 图表堆叠折线区域图中只显示没有区域的线?
如何从 JSON 获取数据以在 PrimeNG 折线图中使用?