Get mouse clicked X and Y axis values

Hi all,

How to get X and Y axis values when mouse clicking on the chart?

Thank you.

1 Reply

KM Kesavan Muthusamy Syncfusion Team August 14, 2019 07:16 AM UTC

Hi Isanka, 

Greetings from Syncfusion. 

We have analyzed your query. We can obtain the x and y Axis values in the mouse click. To achieve this you can import the getValueXByPoint() and getValueYByPoint() from our package like in the below snippet: 

Code snippet:  
  mouseClick = (args: IMouseEventArgs) => { 
     
    this.xValue = getValueXByPoint(Math.abs(args.x - this.xAxis.rect.x), this.xAxis.rect.width, this.xAxis); 
    this.yValue = getValueYByPoint(Math.abs(args.y - this.yAxis.rect.y), this.yAxis.rect.height, this.yAxis) 
    alert('xValue:' + this.xValue.toFixed(3) + ' - ' + 'yValue:' + this.yValue.toFixed(3)) 
     
  } 

Output: 
 

Sample 
We have attached the stackblitz sample link for your reference. 

Please let us know if you have any concerns about this. 

Regards, 
Kesavan 


Loader.
Up arrow icon