页面树结构
转至元数据结尾
转至元数据起始


示例说明

在电子表格中可以通过宏实现树状结构,数据之间存在层级关系,可以展开收缩,如下:

版本及客户端说明

1.smartbi版本:V9

2.客户端:PC

3.浏览器:IE11、谷歌浏览器(Chrome)、火狐浏览器(Firefox)

设置方法

1.数据准备,该电子表格数据必须拥有id和父id字段,并且按顺序排序,如下:

2.在电子表格设计其中,创建电子表格。如下:


3.在浏览器的资源定制节点下,选中电子表格,右键选择 编辑宏 进入报表宏界面

4.在报表宏便捷界面新建 服务端模块, 在弹出的新建模块对话框中选择对象为 spreadsheetReport,事件为 onBeforeOutput,并将下面宏代码复制到代码编辑区域。

宏类型

类型对象事件
ServerSidespreadsheetReportonBeforeOutput


宏代码

function main(spreadsheetReport) {
    spreadsheetReport.printExpandedPositions();
}


5.在报表宏编辑界面新建客户端模块,在弹出的新建模块窗口中选择对象为 spreadsheetReport,事件为onRender,并将下面的代码复制到代码编辑区,根据实际情况进行修改

宏类型

类型对象事件
ClientSidespreadsheetReportonRender

宏代码

function main(spreadsheetReport) {
    /*构造收起展开模块 */
    var TreeSpreadsheetReport = jsloader.resolve("smartbi.spreadsheetreport.TreeSpreadsheetReport");
    var list = spreadsheetReport.getExpandedPositions("C5"); //根据C5单元格字段扩展出的数据获取数据总行数
    var endRow = spreadsheetReport.parseCellIndex(list[list.length - 1])[0];
    var treeSpreadsheetReport = new TreeSpreadsheetReport();
    treeSpreadsheetReport.header.fromRow = 4; //从那行开始展示树状,从0开始算起
    treeSpreadsheetReport.header.idColumn = 4; //ID字段所存在的列,从0开始算起
    treeSpreadsheetReport.header.headerColumn = 2; //哪一列可以点击进行展开收缩,>符号所在的那一列
    treeSpreadsheetReport.header.pidColumn = 5; //PID字段所存在的列,从0开始算起
    treeSpreadsheetReport.header.toRow = endRow; //树状结构的结束行

    //默认折叠全部
    treeSpreadsheetReport.header.collapseAll = true;

    //定义结束树结构
    /* 计算 */
    treeSpreadsheetReport.render(spreadsheetReport);
}

关键对象总结

  • 在服务端中通过spreadsheetReport.printExpandedPositions()打印单元格,在客户端宏中才能通过spreadsheetReport.getExpandedPositions("B5")或者数据列的扩展结果
  • 设置树状结构的起始行、结束行、ID列、父ID列及显示+、-号的列
        treeSpreadsheetReport.header.fromRow = 4; //开始的行号,从0开始计数
        treeSpreadsheetReport.header.toRow = Row; //结束的行号,小于0表示所有行
        treeSpreadsheetReport.header.idColumn = 1; //id所在的列号
        treeSpreadsheetReport.header.pidColumn = 2; //pid所在的列号
        treeSpreadsheetReport.header.headerColumn = 3; //显示+、-号的列

资源下载

报表资源:电子表格树状结构_第一列合并.xml