<link href="https://cdn.webdatarocks.com/latest/webdatarocks.min.css" rel="stylesheet"/>
<script src="https://cdn.webdatarocks.com/latest/webdatarocks.toolbar.min.js"></script>
<script src="https://cdn.webdatarocks.com/latest/webdatarocks.js"></script>
<div id="wdr-component"></div>
#wdr-pivot-view #wdr-grid-view div.alter1 {
background-color: #eff9ff;
}
#wdr-pivot-view #wdr-grid-view div.alter2 {
background-color: #cceeff;
}
var pivot = new WebDataRocks({
container: "#wdr-component",
height: 395,
customizeCell: customizeCellFunction,
report: "https://cdn.webdatarocks.com/reports/report.json"
});
function customizeCellFunction(cellBuilder, cellData) {
if (cellData.type == "value") {
if (cellData.rowIndex % 2 == 0) {
cellBuilder.addClass("alter1");
} else {
cellBuilder.addClass("alter2");
}
}
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.