Listener to react on mouse clicks on data points

[magicroomy]

I am looking for an example to establish a listener to react on the user clicking on a single data point (Entry in a dataset). So I could direct the user to the "detail" of the point in another window.
If it is important: I use DoubleErrorDataSets in XY Graphs.

[wirew0rm]

Because the rendering is based on the canvas and not on the scene graph, you cannot directly get a listener to individual data points.

As the DataPointTooltip plugin solves a similar problem, you can probably use a lot of its code to create your own plugin. See here how the mouse listener is set up. It also has the code necessary to find the closest data point to the clicked mouse position (Not trivial, because a chart can have multiple renderers with different axes, datasets can be added to multiple renderers at the same time, datareduction).

[magicroomy]

Thank you for the hint... It worked (I almost copied the complete DataPointTooltip :-) )
And again I have to say.. great work with ChartFX !!!

[thhart]

@magicroomy Any chance to share some code here, I am looking for the same functionality?

[magicroomy]

Sorry, bad news. I had to do some software archeology. I turned out that I kicked the idea of having click events on data points, sorry.
I also tried to follow the like described by wirew0rm to maybe reconstruct it. The page is gone... 404
So sorry again.

[wirew0rm]

Replaced the link with a permalink.

[yezhengli-Mr9]

@magicroomy Any chance to share some code here, I am looking for the same functionality?

Same question, any code for this is welcome~ @magicroomy
Used to try things like following but not work so far.

• adding Tooltip or DatapointTooltip (as @wirew0rm pointed)
  

  chart-fx/chartfx-chart/src/main/java/io/fair_acc/chartfx/plugins/DataPointTooltip.java

  Lines 75 to 81 in 5719d92

  	public DataPointTooltip() {
  	label.getStyleClass().add(DataPointTooltip.STYLE_CLASS_LABEL);
  	label.setWrapText(true);
  	label.setMinWidth(0);
  	label.setManaged(false);
  	registerInputEventHandler(MouseEvent.MOUSE_MOVED, mouseMoveHandler);
  	}

  
  after
  

  chart-fx/chartfx-chart/src/main/java/io/fair_acc/chartfx/renderer/spi/financial/CandleStickRenderer.java

  Lines 215 to 219 in ed86318

  	// paint candle
  	gc.strokeLine(x0, yLow, x0, yDiff > 0 ? yOpen : yClose);
  	gc.strokeLine(x0, yHigh, x0, yDiff > 0 ? yClose : yOpen);
  	gc.fillRect(x0 - barWidthHalf, yMin, localBarWidth, yDiff); // open-close
  	gc.strokeRect(x0 - barWidthHalf, yMin, localBarWidth, yDiff); // open-close

                 Rectangle rect = new Rectangle(x0-barWidthHalf, yLow, x0+barWidthHalf,yHigh);
                Tooltip t = new Tooltip("Hello, World!");
                Tooltip.install(rect, t);

                rect.setOnMouseMoved(event -> {
                    if (x0-barWidthHalf< event.getX() &&
                            event.getX() <x0+barWidthHalf &&
                            yLow< event.getY() &&
                            event.getY()< yHigh
                    ) {
                        t.show(rect, event.getScreenX(), event.getScreenY());
                    } else {
                        t.hide();
                    }
                });

• add to https://blog.csdn.net/qq_40946921/article/details/84858886

Text text = new Text("Hover over the rectangle +("+i+","+j+")");
                cover[i][j].setOnMouseEntered(e-> {
                    cover[a][b].setFill(Color.rgb(150, 180, 200));
                    if (cover[a][b].contains(e.getX(), e.getY())) {
                        text.setVisible(true);
                    } else {
                        text.setVisible(false);
                    }
//                    getChildren().addAll(cover[a][b], text);
                });

• Tooltip(...) in https://www.geeksforgeeks.org/javafx-tooltip/

Also checking findNearestDataPointWithinPickingDistance(...) in different versions (for earlier version #527 )

chart-fx/chartfx-chart/src/main/java/de/gsi/chart/plugins/DataPointTooltip.java

Lines 102 to 115 in cd202c7

	private Optional<DataPoint> findNearestDataPointWithinPickingDistance(final Point2D mouseLocation) {
	final Chart chart = getChart();
	if (!(chart instanceof XYChart)) {
	return Optional.empty();
	}
	final XYChart xyChart = (XYChart) chart;
	final ObservableList<DataSet> xyChartDatasets = xyChart.getDatasets();
	return xyChart.getRenderers().stream() // for all renderers
	.flatMap(renderer -> Stream.of(renderer.getDatasets(), xyChartDatasets) //
	.flatMap(List::stream) // combine global and renderer specific Datasets
	.flatMap(dataset -> getPointsCloseToCursor(dataset, renderer, mouseLocation))) // get points in range of cursor
	.reduce((p1, p2) -> p1.distanceFromMouse < p2.distanceFromMouse ? p1 : p2); // find closest point
	}

chart-fx/chartfx-chart/src/main/java/io/fair_acc/chartfx/plugins/DataPointTooltip.java

Lines 103 to 116 in ed86318

	protected Optional<DataPoint> findNearestDataPointWithinPickingDistance(final Point2D mouseLocation) {
	final Chart chart = getChart();
	if (!(chart instanceof XYChart)) {
	return Optional.empty();
	}
	final XYChart xyChart = (XYChart) chart;
	final ObservableList<DataSet> xyChartDatasets = xyChart.getDatasets();
	return xyChart.getRenderers().stream() // for all renderers
	.flatMap(renderer -> Stream.of(renderer.getDatasets(), xyChartDatasets) //
	.flatMap(List::stream) // combine global and renderer specific Datasets
	.flatMap(dataset -> getPointsCloseToCursor(dataset, renderer, mouseLocation))) // get points in range of cursor
	.reduce((p1, p2) -> p1.distanceFromMouse <= p2.distanceFromMouse ? p1 : p2); // find closest point, tie-breaking in favor of earlier data sets to match rendering order
	}