如何在 JavaFX 中隐藏和取消隐藏折线图中的数据点？

Question

In the application I need to create, I have a series of points which are connected by lines. I need to only see the line part of the graph and hide the points. However, I need to mark certain points by clicking on the appropriate places in the graph. In the code I have written I am either able to hide the points and not able to mark or I am able to mark but not hide the rest of the points. What do I do to hide the points and mark the required points?

package application;
import java.awt.Dimension;
import java.awt.Toolkit;
//import java.beans.EventHandler;

import java.util.ArrayList;
import javafx.event.EventHandler;
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.input.MouseButton;
import javafx.scene.input.MouseEvent;
import javafx.scene.Scene;
import javafx.scene.chart.Axis;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.scene.layout.Priority;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;

public class Main extends Application {
    public XYChart.Data<Integer, Integer> k = new XYChart.Data();
    public XYChart.Series series;
    String pth;
    public ObservableList<XYChart.Data<Integer, Integer>> dat = FXCollections.<XYChart.Data<Integer, Integer>>observableArrayList();
    public int c = 0;
    ArrayList<Integer> myListx = new ArrayList<Integer>();

    public void start(Stage stage) {
        stage.setTitle("Line Chart Sample");
        final NumberAxis xAxis = new NumberAxis();
        final NumberAxis yAxis = new NumberAxis();
        xAxis.setLabel("Samples");
        yAxis.setLabel("Data");

        final LineChart<Number, Number> lineChart = new LineChart<Number, Number>(xAxis, yAxis);
        lineChart.setCreateSymbols(false);
        Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize();
        int width = (int) screenSize.getWidth();
        int height = (int) screenSize.getHeight();

        StackPane spLineChart = new StackPane();
        spLineChart.getChildren().add(lineChart);

        while (c < 20) {
            k = new XYChart.Data<Integer, Integer>(c++, c * 6);
            dat.add(k);
            k.setNode(new Node(c));

        }
        series = new XYChart.Series("IMU Data", dat);

        lineChart.getData().addAll(series);

        xAxis.setVisible(true);
        yAxis.setVisible(true);
        spLineChart.setVisible(true);
        StackPane spButton = new StackPane();
        StackPane sp = new StackPane();
        VBox vbox = new VBox();
        VBox.setVgrow(spLineChart, Priority.ALWAYS);
        vbox.getChildren().addAll(sp, spLineChart, spButton);

        Scene scene = new Scene(vbox, width, height - 500);
        stage.setScene(scene);
        stage.show();

    }

    class Node extends StackPane {
        Node(int priorValue) {
            final Circle circle = createData();
            setOnMouseClicked(new EventHandler<MouseEvent>() {
                @Override
                public void handle(MouseEvent mouseEvent) {
                    if (mouseEvent.getButton().equals(MouseButton.PRIMARY)) {
                        getChildren().setAll(circle);
                        myListx.add(priorValue);
                    } else if (mouseEvent.getButton().equals(MouseButton.SECONDARY)) {
                        getChildren().clear();

                        myListx.remove(new Integer(priorValue));

                    }
                }

                ;
            });
        }

        private Circle createData() {
            Circle circle = new Circle();
            circle.setFill(Color.BLACK);
            circle.setStroke(Color.BLACK);
            circle.setRadius(4);
            return circle;
        }
    }

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

Answer 1

Use this modified Node class. Where on-mouse click event, it toggles the effect as per the existence of its children.

class Node extends StackPane {
    Node(int priorValue) {
        setOnMouseClicked(event -> {
            if (getChildren().isEmpty()) {
                final Circle circle = createData();
                getChildren().setAll(circle);
            } else {
                getChildren().clear();
            }
            myListx.add(priorValue);
        });
    }

    private Circle createData() {
        Circle circle = new Circle();
        circle.setFill(Color.BLACK);
        circle.setStroke(Color.BLACK);
        circle.setRadius(4);
        return circle;
    }
}

Note: You may consider renaming your class Node as it clashes with Node .