多级分组单元格合并报表

小智数据

于 2024-07-22 09:59:42 发布

阅读量202

点赞数 8

文章标签：小智开源报表 excel报表样式多级分组单元格合并报表纯前端js报表

本文链接：https://blog.csdn.net/tianzhi2016/article/details/140601747

版权

分组报表–多级分组单元格合并报表

概述

多级分组单元格合并报表：演示多级分组占列式分组报表。

应用场景

如下图所示，简单展示数据

示例说明

数据准备

在数据面板中添加数据集，可选择Json数据集和Http接口数据集，Json数据如下图所示：

[{"商品":" A产品","季度":1,"年份":2020,"销售额":1},{"商品":" A产品","季度":2,"年份":2020,"销售额":2},{"商品":" A产品","季度":3,"年份":2020,"销售额":1},{"商品":" A产品","季度":4,"年份":2020,"销售额":1},{"商品":" A产品","季度":1,"年份":2021,"销售额":2},{"商品":" A产品","季度":2,"年份":2021,"销售额":2},{"商品":" A产品","季度":3,"年份":2021,"销售额":1},{"商品":" A产品","季度":4,"年份":2021,"销售额":2},{"商品":" B产品","季度":1,"年份":2020,"销售额":3},{"商品":" B产品","季度":2,"年份":2020,"销售额":1},{"商品":" B产品","季度":3,"年份":2020,"销售额":2},{"商品":" B产品","季度":4,"年份":2020,"销售额":1},{"商品":" B产品","季度":1,"年份":2021,"销售额":2},{"商品":" B产品","季度":2,"年份":2021,"销售额":1},{"商品":" B产品","季度":3,"年份":2021,"销售额":3},{"商品":" B产品","季度":4,"年份":2021,"销售额":2}]

报表设计

合并A2-A4单元格、B2-B3单元格、B4-C4单元格、A5-C5单元格。
将数据字段拖入A2、B2、C2、D2单元格，并设置成向下扩展。
A2(test.商品)、B2(test.年份)和C2(test.季度)设置成分组，D2(test.销售额)设置成汇总。
在D3、D4、D5单元格输入公式=sum(D2)
选中A1-D5单元格，点击上方工具栏-添加分组；选中B1-D4单元格，点击上方工具栏-添加分组；选中C1-D3单元格，点击上方工具栏-添加分组。
如下图所示

效果预览

多级分组单元格合并.json

https://www.yuque.com/attachments/yuque/0/2023/json/25420404/1700464740045-6dfdf90f-8291-43cf-b6dd-cfaab45bd995.json

参考文档

小智报表样例源码下载
- https://gitee.com/tizdata_admin/vue-xzreport-example.git
小智报表demo体验
- https://xzdemo.tizdata.com/#/imbedShow/reportExample
- 丰富的报表模板示例
小智报表在线试用
- https://xzreport.com
小智报表js sdk下载
- https://tizdata.com/xzdownload/
开发使用文档
- https://doc.tizdata.com/xiaozhi/650