Skip to content

fe6/sparklines

Repository files navigation

sparklines

迷你图

Status: Pre-Alpha.

  • 公共参数
完成度 描述 参数 类型 可选值 默认值
设置宽度 width number 'auto'
设置高度 height number 'auto'
设置类型 type number line 'auto'
数据可配置 values number[] []
图表内上下左右的边距 padding number 0
设置为true可禁用所有迷你图交互 disableInteraction boolean false
如果为true,则提供给图的y值将被裁剪为介于chartRangeMin和chartRangeMax之间-默认情况下,chartRangeMin / Max仅确保图表至少跨越了该值范围,但不对其进行限制 chartRangeClip boolean false
指定用于图表的Y值范围的最小值-默认为所提供的最小值 chartRangeMin number
指定用于图表的Y值范围的最大值-默认为所提供的最大值 chartRangeMax number
  • 折线图(type = 'line')

折线图

完成度 描述 参数 类型 可选值 默认值
线的宽度 lineWidth number 1
线的颜色,为空的时候没有颜色,默认: 佛晓蓝7 lineColor string '#096dd9'
填充的颜色,为空的时候没有颜色,默认:佛晓蓝2 fillColor string '#bae7ff'
所有点标记的半径,以像素为单位 spotRadius number 1
图表中每个值的默认宽度均为3像素 defaultPixelsPerValue number 3
最终值标记的CSS颜色。设置为空字符串将其隐藏,默认: 薄暮6 spotColor string '#f5222d'
为最小值显示的标记的CSS颜色。设置为false或空字符串以将其隐藏,默认: 薄暮6 minSpotColor boolean '#f5222d'
为最大值显示的标记的CSS颜色。设置为false或空字符串以将其隐藏,默认: 薄暮6 maxSpotColor boolean '#f5222d'
指定当鼠标悬停在值上时显示在该值上的斑点的颜色。设置为空以禁用。 highlightSpotColor string '#5f5'
为鼠标悬停时通过值显示的垂直线指定颜色。设置为null以禁用。 highlightLineColor string '#f22'
  • 柱状图(type = 'bar')

柱状图

完成度 描述 参数 类型 可选值 默认值
正数的颜色, 默认: 薄暮 barColor string '#f5222d'
负数的颜色, 默认:极光绿 negBarColor string '#52c41a'
0 的颜色,默认:灰色 zeroColor string '#bfbfbf'
柱子的宽度 barWidth number 4
柱子的间距 barSpacing number 1
是否正负数两级分开显示 zeroAxis boolean true
  • 饼图(type = 'pie')

饼图

完成度 描述 参数 类型 可选值 默认值
围绕整个饼图绘制的边框宽度(以像素为单位) borderWidth number 0
以度为单位的角度以偏移第一个切片,尝试 -90 或 90 offset number 0
用于饼图的CSS颜色数组,默认: [日暮, 青柠, 法式洋红, 佛晓蓝, 薄暮, 金盏花, 极光绿, 极客蓝, 火山, 日出, 明青, 酱紫] sliceColors string[] ['#fa8c16','#a0d911','#eb2f96','#1890ff', '#f5222d','#faad14', '#52c41a', '#2f54eb', '#fa541c','#fadb14','#13c2c2','#722ed1',]
用于绘制饼图边框的CSS颜色 borderColor string '#000'