缩略轴 - Slider

阅读时间约 1 分钟

缩略轴组件,Slider,可以让用户在数据量较大的情况下一次只关注局部的数据。

chart.option('slider', options); // 开启缩略轴组件
chart.option('slider', false); // 关闭缩略轴组件

slider options 配置如下:

options.height

number optional

组件高度

options.trendCfg

TrendCfg optional

滑块背景趋势图配置。TrendCfg 配置如下:

参数名类型是否必选默认值描述
datanumber[]-趋势图数据,组件会默认根据图表数据填充,无需配置
smoothbooleanfalse趋势图曲线是否圆滑
isAreabooleanfalse趋势图是否使用面积图
backgroundStyleShapeAttrs-背景样式
lineStyleShapeAttrs-折线图样式
areaStyleShapeAttrs-面积图样式

options.backgroundStyle

ShapeAttrs optional

滑块背景样式

options.foregroundStyle

ShapeAttrs optional

滑块前景样式

options.handlerStyle

ShapeAttrs optional

滑块两个操作块前景样式

options.minLimit

number optional

允许滑块位置的最大值

options.maxLimit

number optional

允许滑块位置的最小值

options.start

number optional

滑块初始化的起始位置

options.end

number optional

滑块初始化的结束位置

options.padding

number[] optional

布局的 padding

options.formatter

(value: any, datum: Datum, idx:number) => string optional