Google Chart API 生成图片

原创 2013年12月04日 09:52:57

 

上周,Google公布了制图服务(Google Chart)的接口,可以用来为统计数据自动生成图片。

这项服务用起来相当简单,不用安装任何软件,只使用浏览器就可以。比如,在浏览器的地址栏中,键入如下的地址:

http://chart.apis.google.com/chart?cht=p3&chd=s:hW&chs=250x100&chl=Hello|World&chtt=Hello+World

就可以看到下面的图片:

各个参数的含义:

  * cht(chart type):图表种类,cht=p3表示生成3D饼图。

  * chs(chart size):图表面积,chs=250x100表示宽200像素,高100像素。

  * chtt(chart title):图表标题,chtt=Hello+World表示标题是Hello World。

  * chd(chart data):图表数据,chd=s:hW表示数据是普通字符串(simple string)hW。目前,允许的编码选择有simple (s)、extended (e)和text (t)。

目前,Google Chart一共提供五种图,分别是折线图(line charts)、条状图(bar charts)、饼图(pie charts)、Venn图(venn diagrams)和散点图(scatter plots)。

googlechartex.png

下面,我根据说明文档,简单介绍一下,如何生成最常见的条状图和饼图。

条状图

下面这张表是各大洲最高峰一览表。

山峰 高度(单位:米)
珠穆朗玛峰(亚洲) 8848
乞力马扎罗山(非洲) 5895
厄尔布鲁士山(欧洲) 5642
麦金利山(北美) 6194
阿空加瓜山(南美) 6960
查亚山(大洋洲) 5029
文森山(南极洲) 5140

根据上表,可以生成下面的条状图:

使用的网址是:

虽然这个网址看起来很复杂,但实际上很容易编写,请跟着我一项项分解:

1. http://chart.apis.google.com/chart?

这部分是google图表服务的网址,所有生成的图表都必须使用这个网址。

"?"后面跟的是参数,格式是"参数名=参数值"。不同的参数之间用"&"分割,次序无所谓。

2. chs=250x250

这一项表示图片的面积,宽x长,单位是像素。

面积最大不能超过30万像素,长和宽最大不超过1000像素。比如,如果上图放大一倍,可以使用chs=500x500

3. chd=t:88.48,58.95,56.42,61.94,69.60,50.29,51.40

这一项"chd=t:"表示图表所用的数据集,最小的值是0.0,最大的值是100.0。

因此,山峰的高度必须改写为88.48、58.95、56.42、61.94、69.60、50.29、51.40,数据与数据之间用逗号分割。

4. cht=bvs

这一项表示所使用的图表类型,bvs表示"竖直条形图",bhs表示"水平条形图",lc表示折线图。

5. chco=ff0000

这一项表示条块的颜色,ff0000表示红色。如果想生成蓝色条块,就使用0000ff

6. chf=c,s,76A4FB|bg,s,FFF2CC

这一项表示填充色,其中又分为两个部分。

"c,s,76A4FB"表示内容部分(c)用蓝色(76A4FB)填充,"bg,s,FFF2CC"表示背景色(bg)用淡黄色(FFF2CC)填充。它们之间用竖线"|"分割。

7. chxt=x,y

这一项表示坐标轴采用底部的x轴和左边的y轴。

8. chxl=0:|Asia|Afri|Euro|AmeN|AmeS|Ocea|Anta|1:|0|5km|10km

这一项表示坐标轴的刻度。

由于只能使用英语,所以x轴的刻度是各大洲的英语缩写,用"0:"开头,y轴的刻度是5千米和1万米,用"1:"开头,所有数据之间用竖线分割。

饼图

下面再举一个饼图的例子。

假定某商场上半年各月份的销售额占总销售额的比例,依次为19%、21%、14%、16%、15%和15%。那么画成饼图,就是下面的样子:

使用的网址是:

与上面的条状图相比,只有两个地方需要说明。

1. cht=p3

这一项表示图片类型为三维饼图,如果使用二维饼图,这一项要改为"cht=p"。

2. chl=Jan|Feb|Mar|Apr|May|June

这一项表示为饼图中每一项数据加上图例。

更多的选项和如何使用多个数据集,请参考Google Chart的说明文档

免费生成二维码图片API使用

生成的二维码图片:http://qr.liantu.com/api.php?&w=200&text=http://www.baidu.com 使用: 这里要注意,联图的这个二维码接口对url中的特殊字...
  • qq_16494241
  • qq_16494241
  • 2016年08月09日 10:09
  • 1558

图片自动生成Google地图的工具

  • 2009年07月15日 14:54
  • 118KB
  • 下载

google api 生成二维码

谷歌提供了一个生成二维码的接口,通过接口我们可以生成二维码,方便又快捷。 接口地址 http://chart.apis.google.com/chart?chs=宽高值x宽高值&cht=qr&chl...
  • u011453631
  • u011453631
  • 2016年02月23日 17:07
  • 2495

Google Map开发系列(五)——怎样在你的网页里嵌入地图

要在自己的网页中嵌入地图,常用的方法可以归纳为以下几种: 1、最简单的方法 ——使用谷歌地图主页的"链接"       如果你只需要在自己的页面上显示某个特定范围的地图,比如你的公司所在地...
  • wangfei19880117
  • wangfei19880117
  • 2016年01月05日 11:17
  • 4482

Android 国内集成使用谷歌地图

由于众做周知的原因在国内使用谷歌地图不太方便,在开发中如果直接使用会出现些问题。但国内的如百度地图,高德地图等都无法提供详细的国外地图数据,所以研究一下喽,,, 使用 Google Maps Andr...
  • qduningning
  • qduningning
  • 2015年03月31日 13:56
  • 27567

使用Google Chart API生成二维码以及制作点子名片

使用google chart api 可以生成二维码,经过ba
  • BeyondQqiang
  • BeyondQqiang
  • 2014年05月16日 21:13
  • 1076

Google Chart API 之生成二维码

Google提供的网络服务API中,最受好评的莫过于Google Chart API了。只要通过它,程序设计人员不需要具备太高深的功力,也不需要具备GD library的知识,就能够做出漂亮的图表、专...
  • wujiaqi168
  • wujiaqi168
  • 2013年12月24日 21:16
  • 954

生成QR Code 二维条形码 ----- Google Chart API

本文详细 介绍 QR Code 二维码的应用 第一部分 通过网络, 前端产生QR Code 二维条形码 产生 QR Code 图像需要传递的参数如下:     名    称   ...
  • aduovip
  • aduovip
  • 2012年03月19日 00:46
  • 8020

如何利用Google chart API产生二维码

  • 2013年12月24日 21:08
  • 55KB
  • 下载

Google Chart API 参考 中文版

Google Chart API 参考 中文版 文档信息 翻译: Cloudream ,最后修改:02/21/2008 22:11:08 英文版版权归 Google , 转载此中文版必须以链接形...
  • youmypig
  • youmypig
  • 2012年11月07日 10:13
  • 1422
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Google Chart API 生成图片
举报原因:
原因补充:

(最多只允许输入30个字)