??企业应用需要打印各类单证及报表，为了方便开发此类应用作者在框架内集成了报表引擎，并且实现了基于Canvas的Web在线报表设计及基于PDFJS的报表查看与打印。

一、原理浅析

• 报表模型：由Xml描述各类报表元素组成（表格、图形、条码等），通过报表设计器生成；
• 数据源：通过推(Push)或拉(Pull)的方式填充报表所需数据，其中Pull模式直接调用框架内服务生成数据源。
• 报表生成：报表引擎解析模型后进行布局与数据填充，并根据需要渲染输出pdf或者其他格式。

二、设计与预览

三、操作说明

1. 新建报表

??通过IDE主菜单->New->Report，输入报表名称后点击确认创建。

2. 添加元素

??切换至工具箱选择需要添加的报表元素，然后在报表设计画布上拖拉添加相应的元素。

3. 设置样式

??选择报表元素后通过属性面板设置字体、颜色、对齐方式、边框等样式。

4. 设置报表数据源

??在设计画布上点击空白处选择报表，在属性面板点击“DataSets”打开数据源对话框，可从实体模型直接生成DataSet，亦可添加自定义字段或删除不必要的字段。

5. 绑定表格数据源

??如下图所示选择整个表格，然后在属性面板的“DataSetName”内选择报表数据源。

6. 添加/删除表格列

7. 绑定表达式

??文本框的Value值如果以=符号开头，则表示为表达式：

• ={FieldName} 表示绑定数据源的字段；
• ={?ParameterName} 表示绑定报表参数；
• ={@GlobalName} 表示绑定报表全局变量，如TotalPages, PageNumber等；

页眉或页脚的文本框绑定字段时，只能使用聚合函数，如:=Sum({FieldName}, "数据源名称")

四、本篇小结

??前后历时近一个月，还有很多功能未实现，如交叉表、图形、表格分组、单元格合并拆分等，另外需要实现报表HTML输出，支持钻取等功能，这样就是一套完整的BI了。一边码代码一边码文实属不易，作者需要您的支持请您多多点赞推荐！

AppBoxFuture: Web在线报表设计与PDF生成

原文：https://www.cnblogs.com/BaiCai/p/12766210.html