codecamp

ECharts控制按钮在不同状态下的样式

ECharts 中控制按钮有两种不同的状态,一种是 normal,表示控制按钮在正常状态下的样式设置;另一种是 emphasis,表示控制按钮在高亮状态下的样式。本节讲述在这两种状态下如何设置 ECharts 控制按钮的颜色、线宽等等。

timeline.controlStyle.normal   |   Object

ECharts 控制按钮的正常状态的样式。

timeline.controlStyle.normal.color   |   Color

[ default: '#304654' ]

设置控制按钮的颜色,默认值为 '#304654'。

timeline.controlStyle.normal.borderColor   |   Color

[ default: '#304654' ]

控制按钮的边框颜色。

timeline.controlStyle.normal.borderWidth   |   number

[ default: 1 ]

控制按钮的边框线宽。

timeline.controlStyle.emphasis   |   Object

设置控制按钮的高亮状态的样式(鼠标 hover 时)。

timeline.controlStyle.emphasis.color   |   Color

[ default: '#c23531' ]

控制按钮的颜色。

timeline.controlStyle.emphasis.borderColor   |   Color

[ default: '#c23531' ]

控制按钮的边框颜色。

timeline.controlStyle.emphasis.borderWidth   |   number

[ default: 2 ]

控制按钮边框线宽。

ECharts当前项的图形样式
ECharts图形元素组件(graphic)
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

ECharts配置项.setOption

ECharts图例组件配置项

ECharts图例组件配置 文本样式

ECharts xAxis配置 直角坐标系x轴

ECharts xAxis配置 x坐标轴名称的文本样式

ECharts xAxis配置 设置x坐标轴轴线

ECharts xAxis配置 x坐标轴刻度设置

ECharts xAxis配置 x坐标轴刻度标签设置

xAxis配置x坐标轴分隔线

xAxis配置坐标轴分隔区域设置

xAxis配置类目数据

ECharts xAxis配置 类目标签的文本样式

ECharts极坐标系的径向轴

如何使用dataZoom组件

ECharts工具栏组件(toolbox)

ECharts工具栏的feature属性

ECharts导出图片的操作

ECharts的数据视图工具

ECharts数据区域缩放工具

ECharts动态类型切换工具

ECharts区域选择组件(brush)

ECharts系列列表:平行坐标系

ECharts系列:主题河流图

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }