汇总面板 Summary

HTML代码

<div id="summaryTest" class="summary-wrap"></div>

javascript代码

require('../../widgets/summary/module');
var getColumns = function () {
    var columns = [];

    columns.push({
    "cName": "showCounts",
    "title": "展示次数"
    });

    columns.push({
    "cName": "clickCounts",
    "title": "点击次数(CLK)"
    });

    columns.push({
    "cName": "viewCounts",
    "title": "访问次数(VV)"
    });

    columns.push({
        "cName": "pageView",
        "title": "浏览量(PV)"
    });

    columns.push({
        "cName": "bounceRate",
        "title": "跳出率"
    });

    columns.push({
        "cName": "avgDayView",
        "title": "平均日浏览次数"
    });

    columns.push({
        "cName": "avgViewDeep",
        "title": "平均页面访问深度"
    });

    return columns;
};

var getRows = function () {
    var rows = [];
    rows.push({
        "dataName": "title",
        "isTitle": true,
        "klass": "summary-span-title"
    });

    rows.push({
        "dataName": "value",
        "klass": "summary-span-value"
    });

    rows.push({
        "dataName": "increase",
        "tpl": "增长数:{0}"
    });

    rows.push({
        "dataName": "rate",
        'render': function (data, full) {
            var num = (Math.round(data * 10000) / 100).toFixed(2),
            _html = "";
            _html = num >= 0 ? ('<span class="summary-span-rate add">+' + num + '%</span>') :
                            ('<span class="summary-span-rate reduce">' + num + '%</span>');
        return _html;
    }
});

return rows;
};

var option = {
    //列
    "allColumns": getColumns(),
    //行
    "allRows": getRows(),
    //数据源
    "dataSource": model.getSummaryData
};
var summary = $p.summary("#summaryTest", option);

JSON 数据

summaryData.json