共计 1108 个字符，预计需要花费 3 分钟才能阅读完成。
DataGear 看板的 dg-chart-theme 属性，提供了简略且弱小的自定义图表主题性能。
通常，只须要设置其 color、backgroundColor、actualBackgroundColor 值即可，看板会依据它们主动生成题目、图例、提示框、高亮框等相干配色。
例如，在 <body> 元素上定义全局图表配色：
| <body style="background-color: #17336c" | |
| dg-chart-theme="{ | |
| color:'#FFF', | |
| backgroundColor:'#17336c', | |
| borderWidth:'2px' | |
| }"> |
对应的效果图如下：
当看板有背景图片时，通常心愿图表背景色是通明的，此时应设置 actualBackgroundColor 为与背景图片统一的色彩，例如：
| <body style="background-image: url(bg.png)" | |
| dg-chart-theme="{ | |
| color:'#FFF', | |
| backgroundColor:'transparent', | |
| actualBackgroundColor:'#17336c', | |
| borderWidth:'2px' | |
| }"> |
也能够为单个图表 <div> 元素增加 dg-chart-theme 属性，仅定义此图表的主题，例如：
| <div dg-chart-widget="..." | |
| dg-chart-theme="{backgroundColor:'green',color:'yellow'}"> | |
| </div> |
对应的效果图如下（第一个图表）：
另外，设置 dg-chart-theme 的graphColors值，能够自定义图表系列条目色彩序列，设置 graphRangeColors 值，则能够定义图表值域映射色彩（地图区域色彩），例如：
| <body style="background-image: url(bg.png)" | |
| dg-chart-theme="{ | |
| color:'#FFF', | |
| backgroundColor:'transparent', | |
| actualBackgroundColor:'#17336c', | |
| graphColors: ['#EE7942', '#FFFF00', '#EE1289'], | |
| graphRangeColors: ['#FFFF00', '#EE7942'], | |
| borderWidth:'2px' | |
| }"> |
对应的效果图如下：
官网地址：http://www.datagear.tech
源码地址：
Gitee：https://gitee.com/datagear/datagear
Github：https://github.com/datageartech/datagear
正文完
