rshree
Posts: 6
Joined: Wed Oct 23, 2019 12:12 pm

Failed to filter the chart data on continuous click without moving the mouse position

Hi ,

I am using area chart where, on click of the chart area region , I should filter the data based on the backend response

Problem Statement :
Scenario1: When I do click on once in the chart area , data will get filter and click event works fine
Scenario 2: When I try to click on twice continuously , one click after another , first click will filter the data where the second click fails to filter the data
Scenario3: When I try to do a click event once and when I move the mouse , and do a second click works fine as expected( filter the data)
basically after each click when I move the mouse inside the chart area or outside the chart area , event triggers and filter data works as expected

Please provide me the solution when I do a click event and when I will not not move the mouse position, it should filter the data in the chart

attached jsfiddle Link: https://jsfiddle.net/ramya_sc/qj42w8ou/8/
michal.f
Posts: 1114
Joined: Thu Aug 12, 2021 12:04 pm

Re: Failed to filter the chart data on continuous click without moving the mouse position

Hello,

This occurs because you are using the redraw() method which causes you to lose the point reference. In the demo below this problem does not occur.
Demo: https://jsfiddle.net/BlackLabel/7mau4tpd/

Let me know if you have any further questions!
Best regards!
Michał Filipiec
Highcharts Developer
https://blacklabel.pl/highcharts/
rshree
Posts: 6
Joined: Wed Oct 23, 2019 12:12 pm

Re: Failed to filter the chart data on continuous click without moving the mouse position

Thanks Michal for your suggestion :)

Let me specify few things ,
I want to filter the chart data on click of the plot region and also chart area region
for chart area region ,
I am using trackByArea inside plotOptions

Code: Select all

plotOptions: {
                    area: {
                         trackByArea: true,
                        series: {
 	                  events: { }
	               }        
	            }
	            
               
}


Already specified problem statement :: Currently click on plot and chart area region works but after one click
user has to move the mouse position for the second click in-order to filter the chart data

Expected Outcome :: user can able to click on plot and area region without moving the mouse position

Your Suggestion :: you told not to use redraw(). I agree and understand your point

Current Scenario Explanation :: let me explain why I am using redraw()
Assume if we have 100 series of data ,
while looping , if the second parameter for the setVisible is true --> chart.series[1].setVisible(!chart.series[1].visible, true);
then 100 times chart will redraw and it will cause performance issue , to avoid the performance issue
I am setting setVisibile's second property as false ---> setVisible(!chart.series[1].visible, false)

FYI attaching this below links:
https://stackoverflow.com/questions/147 ... -very-slow
https://api.highcharts.com/class-refere ... setVisible

please provide me your suggestion
how can I filter the chart data on continuous click without moving the mouse position by keeping redraw()
michal.f
Posts: 1114
Joined: Thu Aug 12, 2021 12:04 pm

Re: Failed to filter the chart data on continuous click without moving the mouse position

Hi,

In your demo, the problem is using the show() method on a series that is visible, which makes no sense because you click on it.
Demo: https://jsfiddle.net/BlackLabel/7absz5ct/

Feel free to ask any further questions!
Best regards!
Michał Filipiec
Highcharts Developer
https://blacklabel.pl/highcharts/
rshree
Posts: 6
Joined: Wed Oct 23, 2019 12:12 pm

Re: Failed to filter the chart data on continuous click without moving the mouse position

Hi Michal,

Thanks a lot for the reply. Your solution works for the chart
But, I am facing another issue where, here is the fiddle link attached by you https://jsfiddle.net/BlackLabel/7absz5ct/

Problem statement : Legends are not toggled properly
for the first time click on one legend , chart will redraw and works fine
but click on second legend will disable both the legends and chart will disappear
and also click on the same legend again, will disable both the legends and chart will disappear

Expectation : Always , at least one legend should be enable and legend should toggle properly and click on the legend for the second time should
filter the data and chart data should be visible when user click on the same legend continuously.

Thank You
michal.f
Posts: 1114
Joined: Thu Aug 12, 2021 12:04 pm

Re: Failed to filter the chart data on continuous click without moving the mouse position

You're welcome!

Do you want the legend to work revers, I understand correctly? If so, in this topic you have the answer: viewtopic.php?f=9&t=47196

In case of any further questions, feel free to contact us again.
Best regards!
Michał Filipiec
Highcharts Developer
https://blacklabel.pl/highcharts/

Return to “Highcharts Usage”