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