搜索
搜索

如何使用JavaFX解决在Scene Builder中绘制图表的问题

Jaskier7 发表于 Java
54
Jaskier7：

我的程序有问题。我想在提供数据（等式的系数）之后绘制图表。

我试图更改导入（它对某些变量有所帮助），我将javafx.scene的java.awt *更改为...（少量导入）。

FXML文件：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.chart.CategoryAxis?>
<?import javafx.scene.chart.LineChart?>
<?import javafx.scene.chart.NumberAxis?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.text.Font?>

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="700.0" prefWidth="800.0" xmlns="http://javafx.com/javafx/8.0.172-ea" xmlns:fx="http://javafx.com/fxml/1" fx:controller="grahps.Controller">
<children>
        <TextField fx:id="factorA" layoutX="24.0" layoutY="598.0" prefHeight="33.0" prefWidth="106.0" text="a=" AnchorPane.bottomAnchor="75.0" AnchorPane.leftAnchor="24.0" AnchorPane.rightAnchor="670.0" />
        <TextField fx:id="factorB" layoutX="24.0" layoutY="630.0" prefHeight="33.0" prefWidth="106.0" text="b=" AnchorPane.bottomAnchor="37.0" AnchorPane.leftAnchor="24.0" AnchorPane.rightAnchor="670.0" />
        <TextField fx:id="factorC" layoutX="24.0" layoutY="674.0" prefHeight="33.0" prefWidth="106.0" text="c=" AnchorPane.bottomAnchor="1.0" AnchorPane.leftAnchor="24.0" AnchorPane.rightAnchor="670.0" />
        <TextField layoutX="158.0" layoutY="592.0" prefHeight="47.0" prefWidth="120.0" text="xMin=" AnchorPane.bottomAnchor="61.0" AnchorPane.leftAnchor="158.0" AnchorPane.rightAnchor="522.0" fx:id="xMin" />
        <TextField layoutX="158.0" layoutY="650.0" prefHeight="47.0" prefWidth="120.0" text="xMax=" AnchorPane.bottomAnchor="3.0" AnchorPane.leftAnchor="158.0" AnchorPane.rightAnchor="522.0" fx:id="xMax" />
        <Label fx:id="label" layoutX="468.0" layoutY="629.0" prefHeight="61.0" prefWidth="276.0" text="f(x)=" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="468.0" AnchorPane.rightAnchor="56.0">
            <font>
                <Font size="18.0" />
            </font>
        </Label>
        <LineChart fx:id="drawChart" prefHeight="598.0" prefWidth="800.0" title="Chart">
            <xAxis>
                <CategoryAxis side="BOTTOM" />
            </xAxis>
            <yAxis>
                <NumberAxis side="LEFT" />
            </yAxis>
        </LineChart>
        <Button fx:id="button" layoutX="317.0" layoutY="612.0" mnemonicParsing="false" prefHeight="61.0" prefWidth="98.0" text="Rysuj wykres" />
    </children>
</AnchorPane>

生成了带有LineChart（fx：id =“ drawChart”）的部分，进行了交流：“未解决的fx：id参考

我的主班：

package grahps;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;


public class Main extends Application {

    private Controller controller;//

    @Override
    public void start(Stage stage) throws Exception {
        stage.show();


        System.out.println(getClass().getResource("/fxml/sample.fxml").getPath());
        FXMLLoader loader = new FXMLLoader(getClass().getResource("/fxml/sample.fxml"));
        loader.setController(controller);
        Parent root = FXMLLoader.load(getClass().getResource("/fxml/sample.fxml"));
        Scene scene = new Scene(root, 800, 800);
        controller.drawChart(stage);
        stage.setScene(scene);
    }

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

最后是我的控制器：

package grahps;
import javafx.fxml.FXML;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.control.TextField;
import javafx.scene.control.Label;
import javafx.scene.control.Button;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;

public class Controller {
    @FXML
    TextField factorA;
    @FXML
    TextField factorB;
    @FXML
    TextField factorC;
    @FXML
    TextField xMin;
    @FXML
    TextField xMax;
    @FXML
    Label label;
    @FXML
    Button button;
    @FXML
    XYChart.Series<Number, Number> chart;

    //Parser Text Field -> double
    double xMax1 = Double.parseDouble(xMax.getText());
    double xMin1 = Double.parseDouble(xMin.getText());
    double a = Double.parseDouble(factorA.getText());
    double b = Double.parseDouble(factorB.getText());
    double c = Double.parseDouble(factorC.getText());

    @FXML
    public void drawChart(Stage stage) {
        XYChart.Series<Number, Number> series = chart;
        series.setName("Chart");

        final NumberAxis xAxis = new NumberAxis(xMin1, xMax1, 1);
        final NumberAxis yAxis = new NumberAxis();
        yAxis.setTickUnit(1);
        xAxis.setLabel("X Label");
        yAxis.setLabel("Y Label");
        final javafx.scene.chart.LineChart<Number, Number> lineChart = new javafx.scene.chart.LineChart<Number, Number>(xAxis, yAxis);
        double y;

        String pattern;
        if (a == 0 && c == 0) {
            pattern = "f(x)=" + factorB;
            label.setText(pattern);
        } else if (c == 0) {
            pattern = "f(x)=" + factorA + "x+" + factorB;
            label.setText(pattern);
            for (double i = xMin1; i <= xMax1; i++) {
                y = a * i + b;
                series.getData().add(new XYChart.Data(i, y));
            }
        } else {
            pattern = "f(x)=" + factorC + "x^2" + factorA + "x+" + factorB;
            label.setText(pattern);
            for (double i = xMin1; i < xMax1; i++) {
                y = a * i * i + b * i + c;
                series.getData().add(new XYChart.Data(i, y));
            }
        }

        lineChart.getData().add(series);
        Scene scene = new Scene(lineChart, 800, 800);
        stage.setScene(scene);
        stage.setResizable(false);
        stage.show();
    }
}

请注意一件事：这是我的第一个JavaFX项目。我只是想填写方程式的系数，并在单击按钮后生成方程式+绘制图表。

我很乐意寻求帮助。

当我删除上述方法的@FXML批注并编译代码时，出现了以下错误：

Exception in Application start method
java.lang.reflect.InvocationTargetException
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.lang.reflect.Method.invoke(Method.java:498)
    at com.sun.javafx.application.LauncherImpl.launchApplicationWithArgs(LauncherImpl.java:389)
    at com.sun.javafx.application.LauncherImpl.launchApplication(LauncherImpl.java:328)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.lang.reflect.Method.invoke(Method.java:498)
    at sun.launcher.LauncherHelper$FXHelper.main(LauncherHelper.java:767)
Caused by: java.lang.RuntimeException: Exception in Application start method
    at com.sun.javafx.application.LauncherImpl.launchApplication1(LauncherImpl.java:917)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication$154(LauncherImpl.java:182)
    at java.lang.Thread.run(Thread.java:748)
Caused by: javafx.fxml.LoadException: 
/C:/Users/Damian/IdeaProjects/Graphs/target/classes/fxml/sample.fxml:14

    at javafx.fxml.FXMLLoader.constructLoadException(FXMLLoader.java:2601)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2579)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2441)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:3214)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:3175)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:3148)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:3124)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:3104)
    at javafx.fxml.FXMLLoader.load(FXMLLoader.java:3097)
    at grahps.Main.start(Main.java:22)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$161(LauncherImpl.java:863)
    at com.sun.javafx.application.PlatformImpl.lambda$runAndWait$174(PlatformImpl.java:326)
    at com.sun.javafx.application.PlatformImpl.lambda$null$172(PlatformImpl.java:295)
    at java.security.AccessController.doPrivileged(Native Method)
    at com.sun.javafx.application.PlatformImpl.lambda$runLater$173(PlatformImpl.java:294)
    at com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:95)
    at com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
    at com.sun.glass.ui.win.WinApplication.lambda$null$147(WinApplication.java:177)
    ... 1 more
Caused by: java.lang.NullPointerException
    at grahps.Controller.<init>(Controller.java:31)
    at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
    at sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:62)
    at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:45)
    at java.lang.reflect.Constructor.newInstance(Constructor.java:423)
    at java.lang.Class.newInstance(Class.java:442)
    at sun.reflect.misc.ReflectUtil.newInstance(ReflectUtil.java:51)
    at javafx.fxml.FXMLLoader$ValueElement.processAttribute(FXMLLoader.java:927)
    at javafx.fxml.FXMLLoader$InstanceDeclarationElement.processAttribute(FXMLLoader.java:971)
    at javafx.fxml.FXMLLoader$Element.processStartElement(FXMLLoader.java:220)
    at javafx.fxml.FXMLLoader$ValueElement.processStartElement(FXMLLoader.java:744)
    at javafx.fxml.FXMLLoader.processStartElement(FXMLLoader.java:2707)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2527)
    ... 17 more
Exception running application grahps.Main

Process finished with exit code 1

另外，我将onAction =“ drawChart”更改为onAction =“ chart”，现在可以看到突出显示的交流信息：“无法将javafx.scene.control.LineChart设置为图表”

黄玉：

代码中有几个错误，例如：

  • //Parser Text Field -> double控制器中的-block执行得太早=> NullPointerException。

  • 当调用controller.drawChart(stage)的start-方法controller等号null=> NullPointerException。

  • 在drawChart控制器的-method中，seriesequals null，因为chartequals null=> NullPointerException。

  • 控制器中缺少对图表的引用。评论中已经提到了这一点。

  • CategoryAxis 尽管x数据是数值，但“ x”用作x轴的类型。

在修复这些错误之前，应改进体系结构（这将自动修复某些错误）：

  • Controller-class：由于必须先初始化图表，然后每次单击按钮才能更新图表，所以控制器中的以下更改将很有用：

    1. 实现initialize-方法，可以在其中进行必要的初始化。

    2. 实现一个updateChart-方法，该方法在单击按钮时被调用，并更新图表。

    3. 定义对LineChart的引用。

    4. 定义对两个轴的引用。

    因此，Controller-class如下所示：

    public class Controller {
    @FXML
    TextField factorA;
    @FXML
    TextField factorB;
    @FXML
    TextField factorC;
    @FXML
    TextField xMin;
    @FXML
    TextField xMax;
    @FXML
    Label label;
    @FXML
    Button button;
    @FXML
    LineChart<Number, Number> chart; 
    @FXML
    NumberAxis xAxis;
    @FXML
    NumberAxis yAxis;
    @FXML
    public void updateChart() {/*ToDo*/}
    public void initialize(){/*ToDo*/}
}

  • Main-class：在start-method中，仅需要加载FXML：

    @Override
public void start(Stage stage) throws Exception {
    Parent root = FXMLLoader.load(getClass().getResource("/fxml/sample.fxml"));
    Scene scene = new Scene(root, 800, 800);
    stage.setScene(scene);
    stage.show();
}

  • FXML：应该进行以下更改：

    1. 将LineChart的ID更改为 fx:id="chart"
    2. 将LineChart的x轴类型更改为 NumberAxis
    3. 添加onAction="#updateChart"到按钮。updateChart单击按钮时，这将调用-method。
    4. 为两个轴（fx:id="xAxis"和fx:id="yAxis"）定义一个ID 。
    5. text="a="对于所有文本字段，请删除所有使用非数字字符的初始化（例如），否则解析会出现问题（例如使用标签或水印会更有意义promptText="a"）。

    然后，FXML变为：

    <AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="700.0" prefWidth="800.0" xmlns="http://javafx.com/javafx/8.0.172-ea" xmlns:fx="http://javafx.com/fxml/1" fx:controller="grahps.Controller">
    <children>
        <TextField fx:id="factorA" prefHeight="33.0" prefWidth="106.0" AnchorPane.bottomAnchor="75.0" AnchorPane.leftAnchor="24.0" AnchorPane.rightAnchor="670.0" promptText="a" />
        <TextField fx:id="factorB" prefHeight="33.0" prefWidth="106.0" AnchorPane.bottomAnchor="37.0" AnchorPane.leftAnchor="24.0" AnchorPane.rightAnchor="670.0" promptText="b" />
        <TextField fx:id="factorC" prefHeight="33.0" prefWidth="106.0" AnchorPane.bottomAnchor="1.0" AnchorPane.leftAnchor="24.0" AnchorPane.rightAnchor="670.0" promptText="c" />
        <TextField fx:id="xMin" prefHeight="47.0" prefWidth="120.0" AnchorPane.bottomAnchor="61.0" AnchorPane.leftAnchor="158.0" AnchorPane.rightAnchor="522.0" promptText="xMin" />
        <TextField fx:id="xMax" prefHeight="47.0" prefWidth="120.0" AnchorPane.bottomAnchor="3.0" AnchorPane.leftAnchor="158.0" AnchorPane.rightAnchor="522.0" promptText="xMax" />
        <Label fx:id="label" prefHeight="61.0" prefWidth="276.0" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="468.0" AnchorPane.rightAnchor="56.0" text="f(x)=" >
            <font>
                <Font size="18.0" />
            </font>
        </Label>
        <LineChart fx:id="chart" prefHeight="598.0" prefWidth="800.0" title="Chart">
            <xAxis>
                <NumberAxis fx:id="xAxis" side="BOTTOM" />
            </xAxis>
            <yAxis>
                <NumberAxis fx:id="yAxis" side="LEFT" />
            </yAxis>
        </LineChart>
        <Button fx:id="button" prefHeight="61.0" prefWidth="98.0" layoutX="317.0" layoutY="612.0" mnemonicParsing="false" text="Rysuj wykres" onAction="#updateChart" />
    </children>
</AnchorPane>

进行这些更改后，启动应用程序时将显示一个空图表（因为尚未实现初始化）。单击该按钮无效（因为尚未执行任何更新）。

  • 初始化：

    public void initialize(){       
    initChartProperties();
    initInputControls();        
    XYChart.Series<Number, Number> series = getSeries();        
    chart.getData().add(series);
}

    本getSeries-方法主要包含的逻辑drawChart-方法：

    private XYChart.Series<Number, Number> getSeries() {

    double xMax1 = Double.parseDouble(xMax.getText());
    double xMin1 = Double.parseDouble(xMin.getText());
    double a = Double.parseDouble(factorA.getText());
    double b = Double.parseDouble(factorB.getText());
    double c = Double.parseDouble(factorC.getText());

    XYChart.Series<Number,Number> series = new XYChart.Series<Number, Number>();
    series.setName("Chart");

    String pattern;
    if (a == 0 && c == 0) {
        pattern = "f(x)=" + factorB.getText();
        label.setText(pattern);
    } else if (c == 0) {
        pattern = "f(x)=" + factorA.getText() + "x+" + factorB.getText();
        label.setText(pattern);
        for (double i = xMin1; i <= xMax1; i++) {
            double y = a * i + b;
            series.getData().add(new Data<Number, Number>(i, y));
        }
    } else {
        pattern = "f(x)=" + factorA.getText() + "x^2+" + factorB.getText() + "x+" + factorC.getText();
        label.setText(pattern);
        for (double i = xMin1; i < xMax1; i++) {
            double y = a * i * i + b * i + c;
            series.getData().add(new Data<Number, Number>(i, y));
        }
    }

    return series;
}

    所述initInputControls-method初始化输入控件，例如：

    private void initInputControls() {
    xMax.setText("100.0");
    xMin.setText("10.0");
    factorA.setText("1.0");
    factorB.setText("2.0");
    factorC.setText("3.0");
}

    所述initChartProperties-method初始化图表：

    private void initChartProperties() {
    chart.setAnimated(true);
    xAxis.setLabel("X Label");
    yAxis.setLabel("Y Label");      
}

    如果要在启动时显示空白图表，只需删除initialize-method 中的最后三行。

  • 更新：更新只是删除旧系列并将新系列添加到图表中：

    @FXML
public void updateChart() {     
    XYChart.Series<Number, Number> series = getSeries();
    chart.getData().clear();
    chart.getData().add(series);
}

这些更改之后，应用程序将按预期运行。左图显示了启动后的应用程序，右图显示了更新输入值后的情况。

在此处输入图片说明

有些事情仍然可以改进，例如，如果更改了窗口大小，应用程序将无法正确缩放。此外，缺少输入字段的验证。可以在initChartProperties-方法中禁用图表动画。

更新：如果没有要显示的符号，请添加initChartProperties-method：

chart.setCreateSymbols(false);

结果是：

在此处输入图片说明

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何与forloop并排绘制图表

使用 PowerShell 绘制图表

使用 LibreOffice 从 CLI 绘制图表

使用groupby函数绘制图的问题

Google图表-使用可变参数绘制图表

如何使用Excel中的按钮选择数据并绘制图表？

如何在Windows Phone 8或8.1中绘制图表而不使用外部库？

如何使用R中的数据框列表绘制图表

如何在没有背景的GraphView中绘制图表？

只有在React中返回了承诺后，我该如何绘制图表？

如何在Excel中随着年龄和其计数绘制图表

如何在xgraph中为我的拖放文件绘制图表

绘制图表时JavaFX WeakReference内存泄漏

如何用Chart.JS绘制图表？

如何在Wikipedia页面上绘制图表

如何根据出勤率绘制图表

pandas - 使用两列的组合自动绘制图表

matplotlib使用散点图反向绘制图表

使用highchart.js绘制图表

使用表格数据框绘制图表

使用CSV数据绘制图表的正确格式

将 R for 循环的结果存储到对象中并使用应用函数绘制图形的问题

使用熊猫的绘图方法在1行中绘制图形的问题

关于使用networkx绘制图形的问题

使用纯CSS3绘制图形的问题

如何使用opengl在pyglet中批量绘制图元？

如何使用SDWebImage在cgcontext中绘制图像

如何使用C ++程序中的gnuplot绘制图形

如何使用Matplotlib在Spyder中绘制图形？

TOP 榜单

  1. 1

    蓝屏死机没有修复解决方案

  2. 2

    计算数据帧中每行的NA

  3. 3

    UITableView的项目向下滚动后更改颜色，然后快速备份

  4. 4

    Node.js中未捕获的异常错误，发生调用

  5. 5

    在 Python 2.7 中。如何从文件中读取特定文本并分配给变量

  6. 6

    Linux的官方Adobe Flash存储库是否已过时？

  7. 7

    验证REST API参数

  8. 8

    ggplot：对齐多个分面图-所有大小不同的分面

  9. 9

    Mac OS X更新后的GRUB 2问题

  10. 10

    通过 Git 在运行 Jenkins 作业时获取 ClassNotFoundException

  11. 11

    带有错误“ where”条件的查询如何返回结果？

  12. 12

    用日期数据透视表和日期顺序查询

  13. 13

    VB.net将2条特定行导出到DataGridView

  14. 14

    如何从视图一次更新多行（ASP.NET - Core）

  15. 15

    Java Eclipse中的错误13，如何解决？

  16. 16

    尝试反复更改屏幕上按钮的位置 - kotlin android studio

  17. 17

    离子动态工具栏背景色

  18. 18

    应用发明者仅从列表中选择一个随机项一次

  19. 19

    当我尝试下载 StanfordNLP en 模型时，出现错误

  20. 20

    python中的boto3文件上传

  21. 21

    在同一Pushwoosh应用程序上Pushwoosh多个捆绑ID

热门标签

归档