amcharts5
amcharts5 copied to clipboard
Cursor on click event does not work reliably
Bug description
I'm trying to trigger an event based on cursor position when click. I've added this eventHandler:
cursor.events.on("click", function(ev){ var x = ev.target.getPrivate("positionX") var value = Math.round(xAxis.positionToValue(x)) alert("Clicked on round " + value) })
Two issues noticed:
- the alert is not always triggered when click. Some click works fine, sometimes not ..
- the conversion from x to value, using positionToValue() as suggested in the docs, is not working properly when the plot is zoomed or panned. The function always converts the xPosition to the xValue of the un-zoomed plot
I would not set click event on cursor, but rather on chart.plotContainer
.
I'm not entirely sure about how to convert relative position into zoomed position. Will get back to you on that.
many thanks for your suggestion!
This eventHandler solve my problem:
chart.plotContainer.events.on("click", function(){ const dataItem = series.get("tooltip").dataItem const round = dataItem.dataContext.round alert("Clicked on round " + round) })
In order to convert cursor's position to a zoomed axis position, you can use axis.toAxisPosition(position)
method. Or you can use coordinate of the click and do it like this:
var value = yAxis.positionToValue(yAxis.coordinateToPosition(point.y));
Here is a working example: https://www.amcharts.com/demos/drawing-chart-series-with-mouse-or-touch/
This issue is stale because it has been open 30 days with no activity. It will be closed in 5 days unless a new comment is added.
@franz-86 thank you so much for posting this here
@martynasma thank you so much for also pointing me in the right direction
This should be in the docs somehow!