详细的Props介绍如下:
datasets
Required Type: Array
图表线(曲线)性质,由对象组成的数组:
data
Type: Number|Object
例如: [70, 100, 400, 180, 100]
or [{ value: 70 }, { value: 100 }, { value: 400 }, { value: 180 }, { value: 100 }]
若是对象,你还可以添加其他属性用于interactive
模式。
className
**
Type: String
在图标上添加的自定义类名
smooth
Type: Boolean Default: false
是否允许峰值四舍五入,以让曲线平滑
stroke
Type: Boolean Default: true
是否绘制线条
fill
Type: Boolean Default: false
是否在曲线下面填充颜色.
showPoints
Type: Boolean Default: false
是否显示点
grid
Type: Object
verticalLines
Type: Boolean Default: false
是否显示垂直网格
verticalLinesNumber
Type: Number
Default: number of xLabels
显示垂直网格的数量,仅当verticalLines
为true
的时候起效。
horizontalLines
Type: Boolean Default: false
是否显示水平网格。
horizontalLinesNumber
Type: Number
Default: number of yLabels
显示水平网格的数量,仅当horizontalLines
为true
的时候起效。
labels
Type: Object
标签属性:
xLabels
Type: Array
X坐标标签。
例如: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
yLabels
Type: Number
Y轴标签数量。
yLabelsTextFormatter
Type: Function
格式化标签的方法。
例如: val => "$" + Math.round(val * 100) / 100
.
如果yLabels
为空,则不起作用
min
Type: Number Default: 数据集的最小值
Y轴的最小坐标值
max
Type: Number Default: 数据集的最大值
Y轴的最大坐标值
padding
Type: String Default: "5"
如果你在你的线条上设置了一个大的线条宽度,你可能会注意到它被“裁剪”到边缘。它类似于没有特定元素的css的“padding”属性。
例如:
"5"
apply to all four sides
"5 10"
vertical | horizontal
"5 15 10"
top | horizontal | bottom
"5 10 15 20"
top | right | bottom | left
interactive
Type: Boolean Default: false
是否允许设置onmoousemove交互。