2015-04-01 70 views

回答

2

这应该让你开始...

google.load("visualization", "1", { 
 
    packages: ["corechart"] 
 
}); 
 
google.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
     ["Week Ending","Actual FT", "Recommended FTE", "Other Tickets", "Router Tickets"], 
 
     ["7/1", 1800, 1900, 19, 22], 
 
     ["7/8", 1800, 1900, 20, 23], 
 
     ["7/15", 1800, 1900, 20, 23], 
 
     ["7/22", 1800, 1900, 19, 22], 
 
     // .. 
 
     ["9/29", 1800, 1900, 29, 30] 
 
    ]); 
 

 

 
    var options2 = { 
 
     vAxes: [{ 
 
      minValue: 1200, 
 
      maxValue: 2500 
 
     }, { 
 
      minValue: 17, 
 
      maxValue: 30 
 
     }], 
 
     
 
     curveType: 'function', 
 
     
 
     hAxis: { 
 
      title: "week ending" 
 
     }, 
 

 

 
     series: { 
 
      0: { 
 
       type: "bars", 
 
       targetAxisIndex: 0, 
 
       color: "blue" 
 
      }, 
 
      1: { 
 
       type: "bars", 
 
       targetAxisIndex: 0, 
 
       color: "green" 
 
      }, 
 
      2: { 
 
       type: "line", 
 
       targetAxisIndex: 1, 
 
       color: "red" 
 
      }, 
 
      3: { 
 
       type: "line", 
 
       targetAxisIndex: 1, 
 
       color: "cyan" 
 
      } 
 
     } 
 
    }; 
 

 
    var chart = new google.visualization.LineChart(document.getElementById("chart")); 
 
    chart.draw(data, options2); 
 
}
<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
 
<div id="chart" style="width: 900px; height: 300px;"></div>