Google Chart API指南(3)
前面部分参见Google Chart API指南(2)。
图表尺寸
使用chs=<width in pixels>x<height in pixels>
图表的最大可能区域是300000像素。最大极限的高度或宽度是1000像素，最大尺寸的例子是1000×300、300×1000、600×500、500×600、800×375和375×800。
图表数据
下面的编码格式是有用的：
- 简单的编码有62种不同值的精度。允许每个数据点五个像素，对于折线图和条形图达到大约300像素是足够的。简单的编码适合于所有其他类型的图表而不管其大小。
- 文本编码有1000种不同值的精度，使用在0.0和100.0之间的浮点数字。允许每个数据点五个像素，整数(1.0、2.0，等等)对于折线图和条形图达到大约500像素是足够的。如果需要更高的精度，包括单个的小数位(例如35.7)。文本编码适合于所有其他类型的图表而不管其大小。
- 扩展的编码有4096种不同值的精度，最好用于需要大数据范围的大图表。
注意：文本编码需要几个字符来编码单个的数据点。简单的编码是最有效的，只为每个数据点使用一个字符。
简单的编码
使用chd=s:<chart data string>指定简单的编码，其中<chart data string>
注意：
- 大写字母A = 0、B = 1 …… Z = 25 。
- 小写字母a = 26、b= 27 …… z = 51。
- 零 (0) = 52 …… 9 = 61。
- 使用下划线(_)指定忽略的值。
- 如果有多组数据，使用逗号(,)分隔每一组。
例如，两组数据：chd=s:ATb19,Mn5tz，其中在每一个数据组中 — A代表0，T 代表19，b 代表27，1 代表53，9 代表 61。
注意：对于简单的编码，Chart API在图表的底部使用值0绘制点，在顶部为61，沿着y轴均匀展开所有其他值。
文本编码
使用chd=t:<chart data string>指定文本编码，其中<chart data string>
注意：
- Zero (0.0) = 0, 1.0 = 1 and so on up to 100.0 = 100.
- 零(0.0)=0，1.0=1…….直到100.0=100。
- 使用-1指定忽略的值。
- 如果有多组数据，使用管道字符(I)分隔每组数据。
例如：chd=t:10.0,58.0,95.0|30.0,8.0,63.0
注意：对于文本编码，Chart API在图表底部使用值0绘制点，在顶部为100.0，沿着y轴均匀展开所有其他值。
扩展的编码
使用chd=e:<chart data string>
注意：
- AA = 0, AZ = 25, Aa = 26, Az = 51, A0 = 52, A9 = 61, A- = 62, A. = 63
BA = 64, BZ = 89, Ba = 90, Bz = 115, B0 = 116, B9 = 125, B- = 126, B. = 127
.A = 4032, .Z = 4057, .a = 4058, .z = 4083, .0 = 4084, .9 = 4093, .- = 4094, .. = 4095. - 使用两个下划线(__) 指定忽略的字符。
- 如果有多组数据，使用逗号(,)分隔每组数据。
注意：对于文本编码，Chart API在图表底部使用值0绘制点，在顶部为4095，沿着y轴均匀展开所有其他值。
编码数据的JavaScript代码片断
编程转换现实数据成Chart API数据比手工转换更容易。
下面的JavaScript代码片断编码数据组成简单的编码。必须提供正数的数组作为数据组，不是正数的数据组值被编码为使用下划字符(_)的忽略值。
调用simpleEncode函数传递数组(values)和数组中的最大值(maxValue)。对于折线图和条形图，如果希望在最大值和图表顶部之间有空间，则使maxValue比数组中的最大值更大。
var simpleEncoding = ‘ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789′;
function simpleEncode(values,maxValue) {
var chartData = ['s:'];
for (var i = 0; i < values.length; i++) {
var currentValue = values[i];
if (!isNaN(currentValue) && currentValue >= 0) {
chartData.push(simpleEncoding.charAt(Math.round((simpleEncoding.length-1) * currentValue / maxValue)));
}
else {
chartData.push(’_');
}
}
return chartData.join(”);
}
间隔尺寸的引导线
当心不要高估图表所需要的数据点数字。例如，要显示过去10年期间Britney Spears是如何流行，汇总每天搜集的查询导致多于3600个值。这将在URL中传递太多的数据，同时以这个间隔尺寸绘制图形没有意义：在1024像素宽的屏幕中一个数据点在屏幕中大约是一个像素的四分之一。正如下面的例子所演示的。
200×100的图表，具有20个数据点(每个数据点10像素)：
40个数据点(每个数据点5像素)：
80个数据点(每个数据点仅2.5像素)：
待续……
Keep it right when you make it faster.
