Trigger a click event when clicked on a line in Line Chart

[Nikitha]

Hi team,

I'm using the chart component with the line chart type. I want to trigger an event when I click on a line series, so that I can get the data of that series and use it. However, I didn't find any event method for a line. Please help.

https://stackblitz.com/edit/angular-6r8igd-w5sp5b?file=app.component.html,app.component.ts

Thank you,

Nikitha R

[Swetha Babu]

Hi Nikitha,

Greetings from Syncfusion.

As of now, we do not have support to show the details of the series when clicking on the line. However, we have achieved this by using chartMouseClick event in the chart. This event gets triggered when clicking on any element in the chart. Based on the target element in the chartMouseClick event, we can find the details of the clicked series. We have modified the provided sample. Please find the below stackblitz link for your reference.

Sample link: https://stackblitz.com/edit/angular-6r8igd-u6aodo

Code Snippet:

public mouseClick(args: any) {

      if(args.target.indexOf("_Series_") > -1) {

          var seriesIndex = parseFloat(args.target.split("_Series_")[1].split("_")[0]);

          console.log(this.linearSchedulingChart.series[seriesIndex].dataSource);

      }

  }

Screenshot:

Kindly revert us if you have any concerns.

Regards,

Swetha