ok.. i had another shot at it once i got other things working. Appears
the individual examples wont work together until a few changes are
made to them.

<!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="https://www.google.com/
jsapi"></script>
     <script type="text/javascript">
       google.load('visualization', '1', {packages: ['corechart']});
     </script>
     <script type="text/javascript">
       function drawVisualization() {
         // Some raw data (not necessarily accurate)
         var data = google.visualization.arrayToDataTable([
           ['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua
Guinea','Rwanda', 'Average'],
           ['2004/05', 165, 938, 522, 998, 450, 614.6],
           ['2005/06', 135, 1120, 599, 1268, 288, 682],
           ['2006/07', 157, 1167, 587, 807, 397, 623],
           ['2007/08', 139, 1110, 615, 968, 215, 609.4],
           ['2008/09', 136, 691, 629, 1026, 366, 569.6]
         ]);

         var options = {
           title : 'Monthly Coffee Production by Country',
           vAxis: {title: "Cups"},
           hAxis: {title: "Month"},
           seriesType: "bars",
           series: {5: {type: "line"}}
         };

         var chart = new
google.visualization.ComboChart(document.getElementById('chart_div'));
         chart.draw(data, options);
       }
       google.setOnLoadCallback(drawVisualization);
     </script>
   </head>

<script type="text/javascript">
function morph(){

 // Some raw data (not necessarily accurate)
    var rowData1 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar',
'Papua  Guinea',
                     'Rwanda', 'Average'],
                    ['2004/05', 165, 938, 522, 998, 450, 114.6],
                    ['2005/06', 135, 1120, 599, 1268, 288, 382],
                    ['2006/07', 157, 1167, 587, 807, 397, 623],
                    ['2007/08', 139, 1110, 615, 968, 215, 409.4],
                    ['2008/09', 136, 691, 629, 1026, 366, 569.6]];
    var rowData2 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar',
'Papua  Guinea',
                     'Rwanda', 'Average'],
                    ['2004/05', 122, 638, 722, 998, 450, 614.6],
                    ['2005/06', 100, 1120, 899, 1268, 288, 682],
                    ['2006/07', 183, 167, 487, 207, 397, 623],
                    ['2007/08', 200, 510, 315, 1068, 215, 609.4],
                    ['2008/09', 123, 491, 829, 826, 366, 569.6]];

    // Create and populate the data tables.
    var data = [];
    data[0] = google.visualization.arrayToDataTable(rowData1);
    data[1] = google.visualization.arrayToDataTable(rowData2);

    var options = {
      width: 400,
      height: 240,
      vAxis: {title: "Cups"},
      hAxis: {title: "Month"},
      seriesType: "bars",
      series: {5: {type: "line"}},
      animation:{
        duration: 1000,
        easing: 'out'
      },
    };
    var current = 0;
    // Create and draw the visualization.
    var chart = new
google.visualization.ComboChart(document.getElementById('chart_div'));
    var button = document.getElementById('b1');
    function drawChart() {
      // Disabling the button while the chart is drawing.
      button.disabled = true;
      google.visualization.events.addListener(chart, 'ready',
          function() {
            button.disabled = false;
            button.value = 'Switch to ' + (current ? 'Tea' :
'Coffee');
          });
      options['title'] = 'Monthly ' + (current ? 'Coffee' : 'Tea') + '
Production by Country';

      chart.draw(data[current], options);
    }
    drawChart();

    button.onclick = function() {
      current = 1 - current;
      drawChart();
    }

}
</script>

   <body style="font-family: Arial;border: 0 none;">
<button type="button" name="b1" id="b1" onclick="morph();">B1</
button>
     <div id="chart_div" style="width: 700px; height: 400px;"></div>
   </body>
 </html>

-- 
You received this message because you are subscribed to the Google Groups 
"Google Visualization API" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to 
[email protected].
For more options, visit this group at 
http://groups.google.com/group/google-visualization-api?hl=en.

Reply via email to