Hello there, I am pretty new to Google Charts, so I am a bit lost. I am trying to setup a bar chart that when a user hovers over a certain bar a custom tool tip comes up, which is based on a column in good spreadsheet.
The Spreadsheet has a whole bunch of columns but as indicated in the query below column A is a Name, Column CO is a dollar amount, and column D is the tooltip data. But whenever I hover over the bars I just get the default tool tip. The url of the chart is here : http://stuartduncan.ca/highchartest/test.html And the code is here : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title> Google Visualization API Sample </title> <script type="text/javascript" src="//www.google.com/jsapi"></script> <script type="text/javascript"> google.load('visualization', '1', {packages: ['barchart']}); </script> <script type="text/javascript"> var visualization; function drawVisualization() { // To see the data that this visualization uses, browse to // http://spreadsheets.google.com/ccc?key=pCQbetd-CptGXxxQIG7VFIQ var query = new google.visualization.Query( 'https://docs.google.com/spreadsheet/pub?key=0AjzReSa2qEsadG1HV0k5ZHVncGx0NDFrTkx4cENlRHc'); // Apply query language. query.setQuery('SELECT A,CO,D ORDER BY CO DESC'); // Send the query with a callback function. query.send(handleQueryResponse); } function handleQueryResponse(response) { if (response.isError()) { alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); return; } var data = response.getDataTable(); data.setColumnProperty(2, 'role', 'tooltip'); visualization = new google.visualization.BarChart(document.getElementById('visualization')); visualization.draw(data, {legend: 'bottom'}); } google.setOnLoadCallback(drawVisualization); </script> </head> <body style="font-family: Arial;border: 0 none;"> <div id="visualization" style="height: 3000px; width: 1200px;"></div> </body> </html> I can't seem to figure out what I am doing wrong. Thanks for any help. -- 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. For more options, visit https://groups.google.com/groups/opt_out.
