默认的 series.encode
值得一提的是,当 series.encode 并没有指定时,ECharts 针对最常见直角坐标系中的图表(折线图、柱状图、散点图、K 线图等)、饼图、漏斗图,会采用一些默认的映射规则。默认的映射规则比较简单,大体是:
在坐标系中(如直角坐标系、极坐标系等)
如果有类目轴(axis.type 为 ‘category’),则将第一列(行)映射到这个轴上,后续每一列(行)对应一个系列。
如果没有类目轴,假如坐标系有两个轴(例如直角坐标系的 X Y 轴),则每两列对应一个系列,这两列分别映射到这两个轴上。
如果没有坐标系(如饼图)
取第一列(行)为名字,第二列(行)为数值(如果只有一列,则取第一列为数值)。
默认的规则不能满足要求时,就可以自己来配置 encode,也并不复杂。这是一个 例子。
几个常见的 series.encode 设置方式举例
问:如何把第三列设置为 X 轴,第五列设置为 Y 轴?
答:
option = {
series: {
// 注意维度序号(dimensionIndex)从 0 开始计数,第三列是 dimensions[2]。
encode: {
x: 2, y: 4 }
// ...
}
};
问:如何把第三行设置为 X 轴,第五行设置为 Y 轴?
答:
option = {
series: {
encode: {
x: 2, y: 4 },
seriesLayoutBy: 'row'
// ...
}
};
问:如何把第二列设置为标签?
答: 关于标签的显示 label.formatter,现在支持引用特定维度的值,例如:
series: {
label: {
// `'{@score}'` 表示 “名为 score” 的维度里的值。
// `'{@[4]}'` 表示引用序号为 4 的维度里的值。
formatter: 'aaa{@product}bbb{@score}ccc{@[4]}ddd';
}
}
问:如何让第 2 列和第 3 列显示在提示框(tooltip)中?
答:
option = {
series: {
encode: {
tooltip: [1, 2]
// ...
}
// ...
}