图表介绍

随着技术发展，数据可视化越来越重要。为了满足日常开发，我们和公司UI部门一起制定了数据可视化的部分内容,目前提供了 折线图, 面积图, 柱状图, 饼图，环形图。我们将图表分为 坐标轴（axis）, 几何图形(geometry)，图例(legend), 提示信息(tooltip), Hover效果 五个主要部分。下面部分我们将针对 坐标轴 做一些基础的介绍。几何图形 的配置详见具体的可视化组件。 图例，提示信息, hover效果目前并不需要开发者进行配置。故不做详细介绍。后续若有配置需要，则再添加。

坐标轴

坐标轴(axis) 即数据展示的维度。目前主要有 x, y 轴两个坐标轴。若需要显示双 y 轴, 我们额外提供了一个 yr 轴。坐标轴的配置，主要分为两个部分。一个部分是该坐标轴使用的数据维度(属性),我们使用 use 属性来配置。另一个部分是坐标轴上显示的刻度信息, 我们使用 scale 属性来进行配置。具体的配置属性见下表：

axis

参数	说明	类型	默认值	是否必须
use	坐标轴使用的数据维度(属性)	string	-	是
scale	坐标轴的刻度信息	object	-	是

scale

根据坐标轴 use 的数据维度的数据类型，刻度支持以下几种数据类型：

• identity，常量类型的数值，也就是说数据的某个字段是不变的常量
• linear，连续的数字 [1, 2, 3, 4, 5]
• cat，分类, ['男','女']
• timeCat，时间类型

根据不同的刻度类型,刻度的配置项有所不同。

通用配置：

参数	类型	说明
type	string	指定不同的度量类型，支持的 type 为 identity、linear、cat、timeCat。
formatter	function	回调函数，用于格式化坐标轴刻度点的文本显示。
range	array	输出数据的范围，数值类型的默认值为 [0, 1]，格式为 [min, max]，min 和 max 均为 0 至 1 范围的数据。
alias	string	该数据字段的显示别名，一般用于将字段的英文名称转换成中文名。
tickCount	number	坐标轴上刻度点的个数，不同的度量类型对应不同的默认值。
ticks	array	用于指定坐标轴上刻度点的文本信息，当用户设置了 ticks 就会按照 ticks 的个数和文本来显示。

linear 类型的刻度的特有属性:

参数	类型	说明
nice	boolean	默认为 true，用于优化数值范围，使绘制的坐标轴刻度线均匀分布。例如原始数据的范围为 [3, 97]，如果 nice 为 true，那么就会将数值范围调整为 [0, 100]。
min	number	定义数值范围的最小值。
max	number	定义数值范围的最大值。
tickInterval	number	用于指定坐标轴各个标度点的间距，是原始数据之间的间距差值，tickCount 和 tickInterval 不可以同时声明。

cat 类型的刻度的特有属性:

参数	类型	说明
values	array	具体的分类的值，一般用于指定具体的顺序和枚举的对应关系。
isRounding	boolean	默认值为 false, 在计算 ticks 的时候是否允许取整以满足刻度之间的均匀分布，取整后可能会和用户设置的 tickCount 不符合。

cat 类型的刻度的特有属性:

时间分类类型，默认会对数据做排序

参数	类型	说明
nice	boolean	默认为 true，用于优化数值范围，使绘制的坐标轴刻度线均匀分布。例如原始数据的范围为 [3, 97]，如果 nice 为 true，那么就会将数值范围调整为 [0, 100]。
mask	string	数据的格式化格式 默认：'YYYY-MM-DD'。
values	array	具体的分类的值，一般用于指定具体的顺序和枚举的对应关系。
isRounding	boolean	默认值为 false, 在计算 ticks 的时候是否允许取整以满足刻度之间的均匀分布，取整后可能会和用户设置的 tickCount 不符合。