淘先锋技术网

首页 1 2 3 4 5 6 7

Echart是一款非常便捷的数据可视化工具,而dataset则是Echart中用到的一个非常重要的数据组织形式。本文将通过示例和解读来介绍dataset的使用方法和格式要求。

Echart中dataset的数据结构是按照行列形式来组织数据的,数据集和数据项都会有一定的格式要求。

首先是数据集的格式要求。在dataset中,数据集用<dataset>标签来表示,属性包括两个必填属性和两个选填属性,分别如下:

<dataset id="xxx" source="xxx">
<dimensions count="x">
<dimension name="xxx"/>
...
</dimensions>
<source>
[ //数据项
['a', 'b', 'c'],
['d', 'e', 'f'],
...
]
</source>
</dataset>

id属性表示数据集的名称,一般设置为“dataset”+序号的形式,如“dataset1”、“dataset2”。source属性表示数据项的来源,是一个二维数组,包含了一堆数据。

然后是数据项的格式要求。在source中,每一组数据都用一个数组表示,也就是数据项。每个数据项中需要包含每个维度的数据,而每个维度都需要一个对应的<dimension>标签来命名和描述对应的数据。例如,下面的代码给出了包含三个维度的数据集:

<dataset id="dataset1" source="datasetSource">
<dimensions count="3">
<dimension name="生产者"/>
<dimension name="使用者"/>
<dimension name="值"/>
</dimensions>
<source id="xxx">
[
['张三', '李四', 12.6],
['王五', '赵六', 23.4],
]
</source>
</dataset>

这里有一个值需要注意,就是每个维度的名称必须是唯一的,否则会出现数据错误。

最后是Echart通过dataset载入数据的示例:

var option = {
dataset: {
source: [
['生产者', '使用者', '值'],
['张三', '李四', 12.6],
['王五', '赵六', 23.4]
]
},
...
};

在以上示例中,通过source属性指定了数据集中的数据项,然后直接在option中使用了这个dataset即可。