如何添加Onclick按钮以显示LineChart JavaFX

Question

I was creating a student score system, the system connect to the database. How can I write the code to show the JavaFX line chart when I click on the "Show Chart" button?

This is the code of my line chart

int i = 1;
@Override  
public void start(Stage primaryStage)   { 
    //define xAxis and yAxis
    NumberAxis xAxis=new NumberAxis(); // create xAxis
    xAxis.setLabel("Student"); // label xAxis

    NumberAxis yAxis=new NumberAxis(); // create yAxis
    yAxis.setLabel("Score"); // label yAxis

    //create line chart using xAxis and yAxis
    LineChart lineChart = new LineChart(xAxis, yAxis);

    //create data series
    XYChart.Series dataSeries1 = new XYChart.Series();
    dataSeries1.setName("Student Score Chart");

    try {  
        Class.forName("com.mysql.jdbc.Driver");  
        Connection con=(Connection) DriverManager.getConnection(DB_URL, USERNANE, PASSWORD);  

        Statement stmt=(Statement) con.createStatement();  
        ResultSet rs=(ResultSet) stmt.executeQuery("select * from student");  


        while(rs.next()){
        dataSeries1.getData().add(new XYChart.Data(i,(rs.getInt(1))));
        i++;
        }

        con.close();  
    } catch(Exception e) { 
            System.out.println(e);  
    } 

    //add data series to line chart

    lineChart.getData().add(dataSeries1);

    //add line chart to layout pane
    VBox vbox = new VBox(lineChart);
    //add layout pane to the scene
    Scene scene = new Scene(vbox, 400, 500);
    //add scene to the stage
    primaryStage.setScene(scene);
    primaryStage.show();
}

and the code of my button

btnShowChart.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent e) {

        }
    });

Answer 1

Here is a basic example ( mcve ):

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class FxMain extends Application {

    @Override
    public void start(Stage primaryStage)   {

        //define xAxis and yAxis
        NumberAxis xAxis=new NumberAxis(); // create xAxis
        xAxis.setLabel("Student"); // label xAxis

        NumberAxis yAxis=new NumberAxis(); // create yAxis
        yAxis.setLabel("Score"); // label yAxis

        //create line chart using xAxis and yAxis
        LineChart lineChart = new LineChart(xAxis, yAxis);

        //create data series
        XYChart.Series dataSeries1 = new XYChart.Series();
        dataSeries1.setName("Student Score Chart");

        for(int i = 0; i <=10 ; i++){
             dataSeries1.getData().add(new XYChart.Data(i, i*3));
        }

        //add data series to line chart
        lineChart.getData().add(dataSeries1);

        //add line chart to layout pane
        VBox vbox = new VBox();
        Button btnShowChart = new Button("Show");
        btnShowChart.setOnAction(e-> {
            vbox.getChildren().add(lineChart);
            btnShowChart.setDisable(true);
        });
        BorderPane root = new BorderPane(vbox);
        root.setBottom(btnShowChart);
        //add layout pane to the scene
        Scene scene = new Scene(root, 400, 500);
        //add scene to the stage
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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