ECharts控制按钮的样式

2018-10-10 10:21 更新

timeline.controlStyle   |   Object

设置 ECharts 时间轴组件中控制按钮的样式。

控制按钮包括:播放按钮、前进按钮、后退按钮。

timeline.controlStyle.show   |   boolean

[ default: true ]

是否显示时间轴组件的控制按钮。设置为 false,则表示所有类型的控制按钮都不显示。

timeline.controlStyle.showPlayBtn   |   boolean

[ default: true ]

是否显示播放按钮。

timeline.controlStyle.showPrevBtn   |   boolean

[ default: true ]

是否显示后退按钮。

timeline.controlStyle.showNextBtn   |   boolean

[ default: true ]

是否显示前进按钮。

timeline.controlStyle.itemSize   |   number

[ default: 22 ]

设置时间轴组件控制按钮的尺寸,单位为像素(px)。

timeline.controlStyle.itemGap   |   number

[ default: 12 ]

设置时间轴组件控制按钮之间的间隔,单位为像素(px)。

timeline.controlStyle.position   |   string

[ default: 'left' ]

设置时间轴组件控制按钮的位置。

timeline.controlStyle.playIcon   |   string

播放按钮的可播放状态的图形。

可以通过 'image://url' 设置为图片,其中 url 为图片的链接,或者 dataURI。

可以通过 'path://' 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 SVG PathData。可以从 Adobe Illustrator 等工具编辑导出。

timeline.controlStyle.stopIcon   |   string

播放按钮的可停止状态的图形。

可以通过 'image://url' 设置为图片,其中 url 为图片的链接,或者 dataURI。

可以通过 'path://' 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 SVG PathData。可以从 Adobe Illustrator 等工具编辑导出。

timeline.controlStyle.prevIcon   |   string

后退按钮的图形

可以通过 'image://url' 设置为图片,其中 url 为图片的链接,或者 dataURI。

可以通过 'path://' 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 SVG PathData。可以从 Adobe Illustrator 等工具编辑导出。

timeline.controlStyle.nextIcon   |   string

前进按钮的图形

可以通过 'image://url' 设置为图片,其中 url 为图片的链接,或者 dataURI。

可以通过 'path://' 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 SVG PathData。可以从 Adobe Illustrator 等工具编辑导出。

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号