single click does nothing! it doesn't get to the handler, i.e. no alert message. why would one example work and not the other! does having more than one chart have anything to do with it? Has google charts been used for dashboards etc. where several charts have to be displayed each with drilldown capability? any suggestions please, I am out of ideas...
On Friday, June 7, 2013 1:09:27 PM UTC-5, [email protected] wrote: > (Sorry if this posts twice first time it said topic could not be found, > when I tried > to view it...) > I am trying to display four charts on the same page, which works fine. I > can see > the 4 charts displayed correctly. I add a listener for one of the charts > but > when I click (double click!) the listener getSelection returns 0? > I tried moving the AddListener before the chart draw but same results. > I removed three charts and just had one, still same results. > Can you please help I have spent so many hours trying variety of things > and I have to get this done in a few days, many thanks. > > Here is part of the code that I believe is relevant: > // left out the ajax call to get the data, data is fine as the charts > are drawn > var data = new google.visualization.DataTable(jsonData); > var totalData = new google.visualization.DataTable(jsonTotalData); > var reasonData = new google.visualization.DataTable(jsonReasonData); > var lossData = new google.visualization.DataTable(jsonLossData); > > var chart = new > google.visualization.ColumnChart(document.getElementById('chart_div')); > var totalChart = new > google.visualization.PieChart(document.getElementById('chart_div_total')); > var reasonChart = new > google.visualization.PieChart(document.getElementById('chart_div_reason')); > var lossChart = new > google.visualization.ColumnChart(document.getElementById('chart_div_loss')); > > chart.draw(data, {width: 400, height: 400}); > totalChart.draw(totalData, { width: 400, height: 400 }); > reasonChart.draw(reasonData, { width: 400, height: 400 }); > lossChart.draw(lossData, { width: 400, height: 400 }); > // add select listener > google.visualization.events.addListener(lossChart, 'select', > selectHandler); > > // select event handler > function selectHandler() { > var url = ''; > var selection = lossChart.getSelection(); > var param = ''; > if( selection.length > 0 ) > { ... some code } > else alert('selection.length '+selection.length); > } > the html is: > > <body> > <!--Div that will hold the pie chart--> > <div id="chart_div"></div> > <div id="chart_div_total"></div> > <div id="chart_div_reason"></div> > > Now I have another file which works OK: > > var data = new google.visualization.DataTable(jsonData); > var chart = new > google.visualization.ColumnChart(document.getElementById('chart_div')); > chart.draw(data, {width: 400, height: 400}); > // add select listener > google.visualization.events.addListener(chart, 'select', selectHandler); > // select event handler > function selectHandler() { > var s = chart.getSelection(); > alert(s.length); > } > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
