I have a php data source page and call ii via query.setQuery in an html page. In that html page I have a select box which passes parameters to chart into the select statement. I want the user to be able to chose a parameter from the select box and chart its value
It works fine - Except rather than overwriting the chart, it puts the next returned chart next to it?.. It overwrites the table fine, but not the chart. Any one able to help? <code> <html> <head> <script type='text/javascript' src='http://www.google.com/jsapi'></ script> <script type='text/javascript'> google.load('visualization', '1', {packages: ['table','columnchart']}); google.setOnLoadCallback(function() { setQuery('plant_cover') }); var dataSourceUrl = "myjson.php"; var opts = {sendMethod: 'xhr'}; var query; var chartOptions = { height: 200, width: 400, }; var tableoptions = { allowHtml:true, showRowNumber: false, alternatingRowStyle: true }; function setQuery(queryString) { query = new google.visualization.Query(dataSourceUrl, opts); query.setQuery('SELECT count(attribute_value), attribute_value WHERE attribute = "'+queryString+'" group by attribute_value'); query.send(handleQueryResponse); } function handleQueryResponse(response) { if (response.isError()) { alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); return; } var data = response.getDataTable(); var table = new google.visualization.Table(document.getElementById ('table_div')); var chart = new google.visualization.ColumnChart (document.getElementById('chart_div')); table.draw(data, tableoptions); chart.draw(data, chartOptions); } </script> </head> <body> <form id="chartForm"> <fieldset id="Results"> <legend>Plot Chart</legend> <div id="attribute-options">Values to plot: <select size="0" id="attributeType" name="attributeType" onchange="setQuery(this.value)"> <option value="option_1">1</option> <option value="option_2">2</option> <option value="option_3">3</option> </select> </div> </fieldset> <fieldset id="ChartResults"> <legend>Characteristics</legend> <div id="table_div"></div> <div id="chart_div"></div> </fieldset> </form> </body> </html> </code> Thanks --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To post to this group, send email to google-visualization-api@googlegroups.com 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 -~----------~----~----~----~------~----~------~--~---
