彩票走势图

ActiveReportsJS是一款基于 HTML5的纯前端报表控件，采用拖拽式报表开发模式，无需任何服务器和组件支持，即可在Mac、Linux 和 Windows 平台中，轻松设计中国式复杂报表、类 Excel/Word报表、DashBoard仪表板等多种报表类型。除提供强大的报表设计能力之外，ActiveReportsJS还具备纯前端报表展示、多数据源绑定、前端精准打印/导出等功能，借助其灵活丰富的API ，可为您带来无与伦比的报表开发体验。

点击下载ActiveReportsJS正式版

ActiveReportsJS的报表设计器，是一款集编辑、预览、导出为一体的跨平台报表设计器，拖拽式报表开发模式，内置矩表、表格、图表等组件，无需任何服务器和组件支持，即可在 Mac、Linux、Windows 等平台中，快速创建中国式复杂报表和各种交互式报表。

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应用