为PivotTable数据透视表自定义主题样式

SpreadJS的数据透视表本身预置了不少的主题，用户可以通过在线编辑器的UI界面做设置，或者通过代码设置切换
比如下面的代码可以切换为黑色主题

1. pivotTable.theme(GC.Spread.Pivot.PivotTableThemes.dark2);

复制代码

详细的主题设置教程可以参考我们的在线示例

https://demo.grapecity.com.cn/spreadjs/SpreadJSTutorial/features/pivot-table/pivot-customize/pivot-theme/purejs


对于有些用户来说，预设的主题可能无法完全满足需求。用户希望通过自定义主题来定制数据透视表中各个部分的样式。
针对这种情况SpraedJS也支持创建自定义主题，下面给出创建自定义主题的代码

1. var custometheme=new GC.Spread.Pivot.PivotTableTheme();
   
2. custometheme.name('custometheme');
   
3. var wholestyle=new GC.Spread.Pivot.PivotTableStyle();
   
4. wholestyle.backColor='#FFDDDD';
   
5. custometheme.wholeTableStyle(wholestyle);
   
6. var headertyle=new GC.Spread.Pivot.PivotTableStyle();
   
7. headertyle.backColor='#AAAAFF';
   
8. custometheme.headerRowStyle(headertyle);
   
9. var subtotalstyle=new GC.Spread.Pivot.PivotTableStyle();
   
10. subtotalstyle.backColor='#FFAAAA';
    
11. custometheme.subtotalRow1Style(subtotalstyle);
    
12. var grandTotalstyle=new GC.Spread.Pivot.PivotTableStyle();
    
13. grandTotalstyle.backColor='#44AAAA';
    
14. custometheme.grandTotalRowStyle(grandTotalstyle);

复制代码

在主题创建完成后，我们就可以直接给pivotTable设置上述主题

1. pt.theme(custometheme);

复制代码

最终效果如下，上述代码仅做演示所以只设置了PivotTableStyle的背景色。实际使用中，你可以针对每个部分比如给总计行设置的grandTotalRowStyle。设置其他的样式数据（边框，字体，对齐）等等。