JavaScriptWebDataRock数据透视表配置来自演示初学者示例

我不能让这个演示工作，使用“hierarchy”参数，即使我指定了参数值，它也会将条件应用于所有层次链

"conditions": [{
            "formula": "#value > 1",                      
            "hierarchy": "Country",
            "measure": "Discount",
            "format": { 
                "backgroundColor": "#C5E1A5",
                "color": "#000000",
                "fontFamily": "Arial",
                "fontSize": "12px"
            }
    }]

初学者演示：

代码笔示例，也可从starter演示中引用：

您可以使用下面的代码替换CodePen JS代码，以直接获得分层渲染

var pivot = new WebDataRocks({
    container: "#wdr-component",
    toolbar: true,
    height: 395,
    report: {
        "slice": {
            "rows": [
                {
                    "uniqueName": "Country"
                },
                {
                    "uniqueName": "Category"
                }
            ],
            "columns":[
            { "uniqueName": "Color" }
            ],
        "measures": [
                {
                    "uniqueName": "Discount",
                    "aggregation": "sum"
                }
            ] ,
        },
        "conditions": [{
            "formula": "#value > 1",                       
            "hierarchy": "Country",
            "measure": "Discount",
            "format": { 
                "backgroundColor": "#C5E1A5",
                "color": "#000000",
                "fontFamily": "Arial",
                "fontSize": "12px"
            }
        }],
        "dataSource": {
        "filename": "https://cdn.webdatarocks.com/data/data.csv"
        }
    }
});

下面是与github相关的问题，

你是对的。

“hierarchy”

参数似乎没有效果

另一种解决方案是使用

customizeCell

hook:应用格式

例如：

JS:

CSS:

下面是一个代码笔示例，用于说明：

var pivot = new WebDataRocks({
  container: "#wdr-component",
  toolbar: true,
  height: 395,
  customizeCell: customizeCellFunction,
  report: {
    slice: {
      rows: [
        {
          uniqueName: "Country"
        },
        {
          uniqueName: "Category"
        }
      ],
      columns: [{ uniqueName: "Color" }],
      measures: [
        {
          uniqueName: "Discount",
          aggregation: "sum"
        }
      ]
    },
    dataSource: {
      filename: "https://cdn.webdatarocks.com/data/data.csv"
    }
  }
});

function customizeCellFunction(cellBuilder, cellData) {
  if (cellData && cellData.type === "value" && cellData.measure && cellData.measure.uniqueName === "Discount" && cellData.value > 1 ) {
    if (
      cellData.rows &&
      cellData.rows.length > 0 &&
      cellData.rows[cellData.rows.length - 1].hierarchyUniqueName === "Country"
    ) {
      cellBuilder.addClass("green");
    }
  }
}

.green {
  background-color: #c5e1a5 !important;
  color: #000000 !important;
  font-family: Arial !important;
  font-size: 12px !important;
}