google chart图表使用

最新推荐文章于 2024-05-13 10:01:05 发布

zhongweijian

最新推荐文章于 2024-05-13 10:01:05 发布

阅读量5.8k

点赞数

文章标签： google visualization function string 浏览器 html

本文链接：https://blog.csdn.net/zhongweijian/article/details/5334234

版权

google chart使用非常简单，用非常的简单的js代码就能实现很漂亮的常用的图表类型，下面是一个示例，直接保存为html文件，用浏览器打开就能显示图表，使用非常简单。

<!DOCTYPE html> <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="http://www.google.com/jsapi"> </script> <script type="text/javascript"> google.load('visualization', '1', {packages: ['piechart']}); </script> <script type="text/javascript"> function drawVisualization() { // Create and populate the data table. var data = new google.visualization.DataTable(); data.addColumn('string', 'Month'); data.addColumn('number', 'Sales'); data.addRows([ ['January',{v:20, f:'$20M'}], ['February',{v:31, f:'$31M'}], ['March',{v:61, f:'$61M'}], ['April',{v:26, f:'$26M'}] ]); // Create and draw the visualization. new google.visualization.PieChart( document.getElementById('visualization')). draw(data, {is3D:true}); } google.setOnLoadCallback(drawVisualization); </script> </head> <body style="font-family: Arial;border: 0 none;"> <div id="visualization" style="width: 300px; height: 300px;"> </div> </body> </html>

google chart code主页地址 http://code.google.com/intl/zh-CN/apis/visualization/documentation/using_overview.html

zhongweijian

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
google chart图表使用

google chart使用非常简单，用非常的简单的js代码就能实现很漂亮的常用的图表类型，下面是一个示例，直接保存为html文件，用浏览器打开就能显示图表，使用非常简单。 <meta http-equiv="content-type" content="text/html; charset=utf-8"/> Google Vi
复制链接

扫一扫