Catching click event in line graph(ngx-echarts)

Question

I am using echarts Angular version- ngx-echarts in my project. I want to catch click event done on a line graph. chartClick or any of the mouse event of ngx-echarts library is not working for line graphs but they are working for barGraphs. How can I catch click events in line graph using ngx-echarts

<div echarts [options]="chartOption" 
    (chartClick)="onChartEvent($event, 'chartClick')">
</div>

onChartEvent(event: any, type: string) {
    console.log('chart event:', type, event);
}

Logical entity is not entering the onChartEvent function even when click is performed

Answer 1

In the line chart the 'chartClick' event gets fired only if you click on the points of the lines.

Answer 2

You can do it by this way. when you build your options, in series object populate:

series: [
                { // your bar
                    type: 'bar',
                    barWidth: '30%',
                    data: myData
                },
                { // shadow bar
                    type: 'bar',
                    barWidth: '30%',
                    itemStyle: {
                        // transparent bar
                        normal: { color: 'rgba(0, 0, 0, 0)' }
                    },
                    barGap: '-100%',
                    data: myDataShadow,
                    animation: false
                }
]

Where myDataShow is a copy of myData.

I recommend you put the biggest value in all positions of myDataShadow to make all bar clickable.