That seems to work fine for me: http://jsfiddle.net/asgallant/A6QrD/
On Monday, March 3, 2014 12:33:25 PM UTC-5, [email protected] wrote: > > Thanks Daniel, but using the syntax you supplied still doesn't get it to > render for me - code below: > > <!--Load the AJAX API--> > <script type="text/javascript" src="https://www.google.com/jsapi > "></script> > <script type="text/javascript"> > > // Load the Visualization API and the piechart package. > google.load('visualization', '1.0', {'packages':['corechart']}); > > // Set a callback to run when the Google Visualization API is loaded. > google.setOnLoadCallback(drawChart); > > // Callback that creates and populates a data table, > // instantiates the pie chart, passes in the data and > // draws it. > function drawChart() { > > // Create the data table. > var data = new google.visualization.DataTable(); > data.addColumn('timeofday', 'Time of Day'); > data.addColumn('number', 'Load'); > data.addRows([ > [[5, 15, 0], 0.1], > [[6, 15, 0], 0.2], > [[7, 15, 0], 0.3], > [[8, 15, 0], 0.4], > [[9, 15, 0], 0.5] > ]); > > // Set chart options > var options = {'title':'Server Load', > 'width':400, > 'height':300}; > > // Instantiate and draw our chart, passing in some options. > var chart = new > google.visualization.LineChart(document.getElementById('chart_div')); > chart.draw(data, options); > } > </script> > > > On Sunday, March 2, 2014 11:25:38 AM UTC+10, [email protected] wrote: >> >> Hi all, >> Need a bit of handholding please. >> I've just started off and am trying to modify the simplest sample chart >> that might suit my purpose - the pizza pie chart. >> >> I've made a few simple mods that leave it still working: >> __________________________________________ >> <!--Load the AJAX API--> >> <script type="text/javascript" src="https://www.google.com/jsapi >> "></script> >> <script type="text/javascript"> >> >> // Load the Visualization API and the piechart package. >> google.load('visualization', '1.0', {'packages':['corechart']}); >> >> // Set a callback to run when the Google Visualization API is >> loaded. >> google.setOnLoadCallback(drawChart); >> >> // Callback that creates and populates a data table, >> // instantiates the pie chart, passes in the data and >> // draws it. >> function drawChart() { >> >> // Create the data table. >> var data = new google.visualization.DataTable(); >> data.addColumn('number', 'Time of Day'); >> data.addColumn('number', 'Load'); >> data.addRows([ >> [8 , 0.1], >> [9 , 0.3], >> [10 , 0.2], >> [11 , 0.8], >> [12 , 0.6] >> ]); >> >> // Set chart options >> var options = {'title':'Server Load', >> 'width':400, >> 'height':300}; >> >> // Instantiate and draw our chart, passing in some options. >> var chart = new >> google.visualization.LineChart(document.getElementById('chart_div')); >> chart.draw(data, options); >> } >> </script> >> ________________________________ >> Now what I'd like to do is change the data.addColumn('number', 'Time of >> Day'); from type:'number' to type:'timeofday' but when I simply do that, >> the chart doesn't render. I suspect I need to change the Row data now to >> suit that field type which I read is a 2 or 4 digit representation of the >> time - I've had a couple of tries at doing that, but can't get it right. >> Can someone point me in the right direction with that first hurdle? >> >> Also, I tried successfully changing the chart line color, but I'd also >> like to add/change a number of other options e.g. background color, axis >> line colors, text color etc - can I simply do that with this chart style >> I'm using? >> >> I've got some other questions if you're patient enough *_* >> >> Many thanks >> >> >> >> -- 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.
