ActiveReportsJS是一款基于 HTML5的纯前端 表控件，采用拖拽式 表开发模式，无需任何服务器和组件支持，即可在Mac、Linux 和 Windows 平台中，轻松设计中国式复杂 表、类 Excel/Word 表、DashBoard仪表板等多种 表类型。除提供强大的 表设计能力之外，ActiveReportsJS还具备纯前端 表展示、多数据源绑定、前端精准打印/导出等功能，借助其灵活丰富的API ，可为您带来无与伦比的 表开发体验。
ActiveReportsJS正式版
ActiveReportsJS 表设计器的组成
设计界面
您可以使用“设计界面”左侧工具箱中的 表组件来创建 表。
在工具箱面板中，列出了所有可用组件，通过双击或将组件拖放到设计器中进行使用。
除了可用组件外，左侧面板还包含了“ 告资源管理器”，用来显示 表的所有元素和控件种类。
数据面板
在设计器的右侧，为“数据面板”，可用于配置数据源和数据集。
属性面板
在数据面板下方，还有属性面板。在这里，您将找到所选控件或元素的属性。
默认情况下，“属性面板”显示的是各元素最常用属性，您可以切换到“高级模式”以显示所选控件或元素的所有属性。
“属性面板”具备搜索功能，可用于搜索属性。
ActiveReportsJS 表设计器的功能特点
数据源
ActiveReportsJS支持使用 ** JSON ** 数据源来构建 表，这是一种轻量级且基于文本的可读格式。除了 .json 文件之外，任何具有有效JSON格式的文件都可以用作数据源。
表达式
表达式用于设置 表中各控件的值，或用于设置某些样式的条件。
交互式 表设计
ActiveReportsJS 的设计器支持钻取、数据深化、交互式排序等功能。交互式 表提供了更加动态、灵活的数据分析能力。若需了解更多信息，请参阅ActiveReportsJS 交互式功能。
参数
参数可用于数据集查询，您可以添加单个或多个值参数，选择提示用户输入参数或完全隐藏参数。
表控件
“页面 表”和“RDL 表”工具箱提供了许多 表控件，用于在创建 表时进行可视化设计。了解详细信息，请参阅ActiveReportsJS 表控件。
如何使用ActiveReportsJS设计器创建 表
如视频中演示的那样，我们创建一张简单的 表，该 表从数据库中加载了一些数据并将其显示在表格内。
第一步，创建 表
打开“文件”菜单，选择RDL 表。
第二步，转到数据面板并添加数据源。
使用嵌入式文件选项，加载带有数据条目的JSON文件。完成后，JSON文件的内容将显示在“嵌入式内容”框中。此时，让我们将数据源的默认名称更改为更具代表性的名称，然后单击“添加数据源”。
第三步，创建一个数据集，用以查询并选择您感兴趣的数据字段。
在查询字段中，选择JSON文件的所有内容。在左侧面板上，打开工具箱并找到Table组件。双击以将Table放置在 表设计器界面上。
第四步，扩展表格的宽度并添加几列。
默认情况下，表格共显示三行。第一行是表头，中间是表格内容，最下面一行是表脚。
要添加列，请选择“表头”，单击鼠标右键，然后选择“ COLUMNSRIGHT”或“ LEFT”，在所选列的右或左插入一列。
要在表中绑定数据，只需在“表格内容”部分单击ADORNERS，从数据集中选择可用字段。
最后一步，预览 表。
单击工具栏上的预览按钮，就可以实时预览到结果。
要返回设计界面，请单击左上方的“后退”箭头。
要保存这张 表模板，请转到“文件”菜单，然后单击“保存”或“另存为”。
注：ActiveReportsJS的 表文件另存为“ .rdlx-json”格式。
至此，一张简单的 表就已经创建完成了，您可以将它添加到应用程序中，并使用 表查看器进行查看。
本教程内容就是这样了，希望对您有所帮助！您可以下载ActiveReportsJS试用版免费体验~
相关内容推荐：
纯前端 表控件 ActiveReportsJS入门教程：如何将ActiveReportsJS的强大功能嵌入到Web应用
想要购买ActiveReportsJS正版授权，或了解更多产品信息请点击【咨询在线客服】
标签：
声明：本站部分文章及图片源自用户投稿，如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢！