guangqiang 发表于 2013-1-29 08:36:51

Google Chart 实现报表统计

当处理数据或者统计结果的时候 通常会遇到一些报表例如 饼状图 曲线图 柱状图
但是实现起来 往往不是很简单,现在运用google chart可以很轻松实现你的目的了.
先看个示例吧
http://dl.iteye.com/upload/attachment/0074/8737/871fb491-9481-37d0-abc5-ab247bdf6b9a.png
 
<html><head>    <!--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('string', 'Topping');      data.addColumn('number', 'Slices');      data.addRows([          ['Mushrooms', 3],          ['Onions', 1],          ['Olives', 1],          ['Zucchini', 1],          ['Pepperoni', 2]      ]);      // Set chart options      var options = {'title':'How Much Pizza I Ate Last Night',                     'width':400,                     'height':300};      // Instantiate and draw our chart, passing in some options.      var chart = new google.visualization.PieChart(document.getElementById('chart_div'));      chart.draw(data, options);      }    </script></head><body>    <!--Div that will hold the pie chart-->    <div id="chart_div"></div></body></html>
页: [1]
查看完整版本: Google Chart 实现报表统计