Echarts组件 -- 标题组件
2017-12-27 11:31:28 0
标题组件主要包含了主标题的配置项、副标题的配置项以及其他的配置项
主标题配置项及副标题配置项
主标题配置项与副标题配置项基本一致,主要包括:- text / subtext: 设置标题文本,支持\n换行
- link / sublink: 设置标题文本超链接
- target / subtarget: 设置打开方式,与a标签类似,不过此处目前暂时只有两个值可选,分别是self(当前窗口打开)以及blank(新窗口打开)
- textStyle / subtextStyle: 设置文本的样式,相关的配置项包括:
- 字体基本样式设置:fontStyle、fontWeight、fontSize、fontFamily
- 文字颜色:color
- 文字描边:textBorderColor(文字的描边颜色)、textBorderWidth(文字的描边宽度)
- 文字阴影:textShadowColor(文字的阴影颜色)、textShadowBlur(文字的阴影长度)、textShadowOffsetX(文字的阴影 X 偏移)、textShadowOffsetY(文字的阴影 Y 偏移)
- 文本块的大小:lineHeight、width、height (这三个配置项在定义了rich以后才会生效)
- 文本块的对齐:align(水平居中)、verticalAlign(垂直居中)
- 自定义富文本样式:rich(可以在这里面定义某一套样式,然后通过这套样式的名称来使用该套样式)
其他的配置项 其他的配置项主要是标题文本块的配置项,包括:
- 文本块的边距:padding
- 文本块的位置:left、top、itemGap(主标题与副标题之间的间距)
- 文本块的边框、背景(颜色或图片):backgroundColor、borderColor、borderWidth、borderRadius
- 文本块的阴影:shadowColor、shadowBlur、shadowOffsetX、shadowOffsetY
把标题组件的配置项整合了下,做了下面这个demo,不想看文字的可以直接看图:
