尝尝用 Google AJAX API 做图表

作者:vkvi 来源:千一网络(原创) 日期:2009-9-2

Google 产品很多,其中有一项服务是 Google 代码。

Google 代码下有很多产品,其中一项产品就是 AJAX APIs。

AJAX APIs 下也有很多东西,其中一项东西就是 Google 可视化 API。

Google 可视化 API,其实就是帮助我们用几句简单的 JavaScript、HTML 等代码,实现复杂的饼图、结构图、表等功能。

visualization.png

下面用官方的示例代码看一个示例

http://code.google.com/intl/zh-CN/apis/visualization/documentation/using_overview.html

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1', {'packages':['piechart']});

// Set a callback to run when the 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() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Task');
    data.addColumn('number', 'Hours per Day');
    data.addRows([
        ['Work', 11],
        ['Eat', 2],
        ['Commute', 2],
        ['Watch TV', 2],
        ['Sleep', 7]
        ]);
    
    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, {width: 400, height: 240, is3D: true, title: 'My Daily Activities'});
}
</script>

效果

Google 可视化 API 应用示例

实际运行一下


[Ctrl+A 全部选择 提示:您可先修改部分代码,再按运行]

你前面那位网友看了:GridView 的 CheckBoxField 为什么不可点击?

▲▲▲嘿,欢迎转载传播本站原创文章,尽量保留来源噢。▲▲▲

文章评论
标题:必填
内容:
本站永远终止与捏造“罪名”不支付广告费的某度联盟合作。
vkvi
vkvi

作者简介: vkvi,致力于 .NET Web 开发、移动开发的技术推广,在 .NET、SQL Server、Windows Server 等方面有深入研究和丰富经验,10 年间共计撰写文章 4000 余篇。 主持金融、国土、农业、电商等多个行业项目执行, 推行“技术提升生产力、人心决定成功率”的管理理论。 联系他