Bar chart freezes if click second time on a bar

3,133 views
Skip to first unread message

Ram

unread,
Apr 6, 2012, 7:49:02 AM4/6/12
to google-visua...@googlegroups.com
I have added Click event for each bar in Visualization Bar Chart. If i click first time on a Bar, the event triggers and my expected result displays properly. But Again if i click on same Bar, event triggers but the Chart freezes. After i am not able to interact with chart. My Bar chart Click event is given below. Note: i have Bar chart with 4 columns and n no.of rows.


My Click Event: 

google.visualization.events.addListener(chart, 'select', function(){
 var row = chart.getSelection()[0].row; //Chart freezes in this line if i click a bar second time
var column = chart.getSelection()[0].column;
var seluser= timedata.getValue(row, 0);
alert('You selected ' + timedata.getValue(row, 0)); 
alert(row+","+column); //These lines run properly when click first time on Bar in Bar Chart.
});



asgallant

unread,
Apr 6, 2012, 8:53:59 AM4/6/12
to google-visua...@googlegroups.com
I plugged that listener code into the Viz playground's BarChart example (changing "timedata" to "data" to make it compatible), and it worked fine; it didn't freeze at all.  The problem must be somewhere else in your code, can you post the code or a link to the page?

ram prasad

unread,
Apr 6, 2012, 9:12:31 AM4/6/12
to google-visua...@googlegroups.com
Thank You  asgallant... I am also tried in Play ground like below coding....I got freezing chart in Playground. Also I got error as " "Uncaught TypeError: Cannot read property 'row' of undefined (retrieve_cache?unique_id=d5541b9085ac908f60fae4763aba5cef3b2fdb30,58)" 

My Play ground Code:

function drawVisualization({
  // Create and populate the data table.
  var data new google.visualization.DataTable();
  var raw_data [['Austria'133606015381561576579160065219681131901067],
                  ['Bulgaria'400361366849440514434552393032517206],
                  ['Denmark'100158211194509933601004163979198916965],
                  ['Greece'99797494179593059389712710808871056036]];
  
  var years [200320042005200620072008];
                  
  data.addColumn('string''Year');
  for (var 0i  raw_data.length++i{
    data.addColumn('number'raw_data[i][0]);    
  }
  
  data.addRows(years.length);
  for (var 0years.length++j{    
    data.setValue(j0years[j].toString());    
  }
  for (var 0i  raw_data.length++i{
    for (var 1j  raw_data[i].length++j{
      data.setValue(j-1i+1raw_data[i][j]);    
    }
  }
  
  // Create and draw the visualization.
  var chart=new google.visualization.BarChart(document.getElementById('visualization'));
  chart.draw(data,
           {title:"Yearly Coffee Consumption by Country",
            width:600height:400,
            vAxis{title"Year"},
            hAxis{title"Cups"}}
      );
  google.visualization.events.addListener(chart'select'function(){
    
    alert(chart.getSelection()[0].row);  //Alert displayed on First. Again if i click same bar,Chart Freezes. 
  
  });
}

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/lxQUCCXPdUgJ.

To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


asgallant

unread,
Apr 6, 2012, 9:24:25 AM4/6/12
to google-visua...@googlegroups.com
Ok, I see what you are talking about.  The "problem" is that the second click is "deselecting" the column, so the chart.getSelection() call is returning an empty array, which is why you are getting that error.  If you clear the selection at the end of your event listener, like this:

google.visualization.events.addListener(chart'select'function(){
    alert(chart.getSelection()[0].row);
    chart.setSelection();  // nulls out the selection 
}); 

then you can click the same bar repeatedly without any issues.

To post to this group, send email to google-visualization-api@googlegroups.com.
To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


ram prasad

unread,
Apr 6, 2012, 9:30:16 AM4/6/12
to google-visua...@googlegroups.com
Oh..Thank Very much  asgallant ..It works fine...Now i am able to click same bar repeatedly without any problem....Thank you again...

To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/EIItGo_a8P8J.

To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


asgallant

unread,
Apr 6, 2012, 9:33:29 AM4/6/12
to google-visua...@googlegroups.com
You're welcome.
To unsubscribe from this group, send email to google-visualization-api+unsubscr...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/EIItGo_a8P8J.

To post to this group, send email to google-visualization-api@googlegroups.com.
To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


KyiPyar Thin

unread,
Feb 9, 2014, 9:10:37 PM2/9/14
to google-visua...@googlegroups.com
Thanks a lot .. it is working well.. there is no issues after adding chart.setSelection();

To post to this group, send email to google-visua...@googlegroups.com.

To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


haroon khokhar

unread,
Aug 12, 2015, 8:12:29 PM8/12/15
to Google Visualization API
Thanks asgallant
...

Hector diaz valenzuela

unread,
Jan 10, 2017, 1:38:04 PM1/10/17
to Google Visualization API
Thanks! It work for me!

To post to this group, send email to google-visua...@googlegroups.com.

To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


Simon Hooper

unread,
Dec 19, 2018, 7:18:42 AM12/19/18
to Google Visualization API
Thank you. Your post has ended several hours of searching for a solution.

To post to this group, send email to google-visua...@googlegroups.com.

To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


Daniel Baldwin

unread,
Aug 1, 2019, 5:35:10 AM8/1/19
to Google Visualization API
Thanks for this. really helped.

I also found that the 'click' handler gets fired first so if you add 
chart.setSelection();

to a click handler, it means you don't lose any selection styling but get a reliable select event every click rather than every other click.

On Friday, April 6, 2012 at 2:24:25 PM UTC+1, asgallant wrote:

To post to this group, send email to google-visua...@googlegroups.com.

To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.



--
BY

R.RAMPRASAD


Reply all
Reply to author
Forward
0 new messages