相比前面的教程 “处理文本或文本数据文件`” 里提到的处理方法,用数据功能模块可以省去自己解析数据,并可以通过灵活的配置参数来处理数据。

使用数据功能模块需要额外的引入相关的文件:

数据功能模块本质上是将数据处理二位表格数据(CSV 、HTML 表格、Google SpreadSheets 本质上也是二维表结构,只是数据格式不同),并转换成数据列的过程。

通过灵活的配置参数,我们可以指定数据表的范围、解析形式、数据处理方式等;其中 、endRow、、endColumn 可以指定数据范围; 可以将数据表行列对调(即行列变换);seriesMapping 可以指定数据列与数据的映射关系;、decimalPoint 可以处理数据的格式化。

通过 可以指定需要加载的 CSV 数据,默认情况下,CSV 数据的第一行将作为数据列的名字,第一列表示数据列的名字、x 轴值或时间,后面的列为数据列值。

CSV 数据的加载可以通过 jQuery.get 来获取(当然也可以用其他方法),下面是具体的示例:

2、图表代码

提示:对于 CSV 数据,我们可以通过 lineDelimiter 及 参数来指定行分隔及列分隔符。

在线试一试

提示:如果不需要在页面显示 HTML 表格,可以通过 CSS 样式将其隐藏,实例如下:

Google SpreadSheets 是一个在线数据表格服务。在数据功能模块里,只需要指定 Google SpreadSheets 生成的 即可加载数据并生成图表。

在线试一试

  • 数据功能模块读取 Google SpreadSheets 需要引入 jQuery,因为内部用 jQuery.get 读取数据