1

在 iccube 报告 V5x 中，我可以通过添加以下指令来加载自定义主题ic3report-config.js

ic3RegisterTheme('Pkcs', 'theme/', 'PkcsTheme.js' , 'PkcsTheme.css' );

然后在里面pkcstheme.js，我用

var ic3;
(function(a) {
    a.Themes.registerTheme({
        name: "PKCS",
        cssCls: "pkcs-theme",
        boxHeaderCls: "pkcs-header",
        reportContainerDefaultStyle: "pkcs",
        amChartsDefaultStyle: "Pkcs Main",
etc...

但是，在 V6 中，a.Themes.registerTheme不存在...

现在这样做的正确方法是什么？

4

1 回答 1

1

IcCube v6.1 引入了新的自定义主题管理：

运行

现在可以使用公共报告上下文 API 在运行时加载/更改主题：

演示报告

使用“更改颜色”按钮执行的 Javascript 片段：

function(context, item) {
    if(!window.demotheme){
        window.demotheme = _.cloneDeep(window.ic3ThemeElegant);
    }

    demotheme.id = "ic3-demotheme";
    demotheme.name = "Demo";

    demotheme.vars.palette = ["#374649", "#fd625e", "#f2c80f", "#01b8aa", "#79c75b", "#8ad4eb"];
    demotheme.vars.backgroundColor = "#eaeaea";
    demotheme.vars.borderColor = "#eaeaea";


    // adding variable to a theme
    demotheme.vars.boxBackgroundColor = "white";


    context.setTheme(demotheme);
}

预载

IcCube 主题管理器将注册放置在以 ic3Theme（例如window.ic3ThemeElegant）开头的全局 JavaScript 范围内的任何主题，并将作为选项在“报告设置”中提供。

例如，您可以在 ic3report-local.js 中使用此类代码：

$script(options.rootLocal + 'ic3ThemeWhiteBox.js', function(){
      options.callback && options.callback();                                                  
   })

ic3ThemeWhiteBox.js 的内容是：

window.ic3ThemeWhiteBox = {
            "id": "ic3-white-box",
            "name": "White Box",
            //... theme definition ...
    })
于 2017-05-05T14:08:22.907 回答