I need to determine if the mouseup event is inside the chart and display the coordinates of the point. The code works in Chrome but not in Firefox due to the lack of the event.offset property.
jQuery(chart.container).mouseup(function (event) {
eoffsetX=event.offsetX;
eoffsetY=event.offsetY;
if (eoffsetX > chartX.plotLeft && eoffsetX < chartX.plotLeft + chartX.plotWidth && eoffsetY > chartX.plotTop && eoffsetY < chartX.plotTop + chartX.plotHeight) {
alert ("The clicked x,y point is "+chart.xAxis[0].toValue(eoffsetX, 0)+" , " + chart.yAxis[0].toValue(eoffsetY, 0));
}
After trying different solutions found online, I modified the code but it still doesn't work for Firefox / IE:
jQuery(chart.container).mouseup(function (event) {
if(event.offsetX === undefined) {
eoffsetX=(event.clientX - jQuery(event.target).offset().left);
eoffsetY=(event.clientY - jQuery(event.target).offset().top);
}
else {
eoffsetX=event.offsetX;
eoffsetY=event.offsetY;
}
if (eoffsetX > chartX.plotLeft && eoffsetX < chartX.plotLeft + chartX.plotWidth && eoffsetY > chartX.plotTop && eoffsetY < chartX.plotTop + chartX.plotHeight) {
alert ("The clicked x,y point is "+chart.xAxis[0].toValue(eoffsetX, 0)+" , " + chart.yAxis[0].toValue(eoffsetY, 0));
}
Any suggestions for a cross-browser solution?