锐浪WEB报表开发包括报表插件、HTML5报表、报表服务器与报表客户端，同一报表模板与报表数据提供程序可以为这四种WEB报表开发方式共用，可以非常容易的从一种开发方式切换到另一种，点击进一步了解锐浪WEB报表。WEB报表支持各种WEB服务器与操作系统，支持任意形式的数据源，而不局限于关系数据库。WEB报表开发相关资料与例子在锐浪报表Grid++Report6安装包中，WEB报表例子包括asp.net(c#,vb)、asp、php、jsp(java)。访问锐浪软件首页详细了解锐浪报表。
官方网站例子演示：
HTML5报表运行在所有支持HTML5的浏览器(目前较新版本的各种浏览器都支持HTML5)中，所以各种操作系统平台(Windows、Linux与Android等)与各种硬件设备(电脑、手机与IPAD等)都能运行锐浪HTML5报表，锐浪HTML5报表是跨平台报表开发的最佳选择。
下面演示各种形式的报表的HTML5报表的展现结果，可以在各种浏览器与设备上运行。表格的“报表模板”与“报表数据”两栏的链接可以打开对应的报表模板与报表数据，通过查看报表数据网页的源数据，可以看到报表的 XML 或 JSON 数据。
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| 1a.简单表格 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/1a.grf | /data/DataCenter.ashx?data=Customer | 一个简单的表格报表。 |
| 1b.双层表头 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/1b.grf | /data/DataCenter.ashx?data=Customer | 双层表头报表，明细网格标题行可以定义任意多层的表头。在设计器‘列标题布局...’界面中在设计时定义多层标头。 |
| 1f.表格中图像与文字 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/1f.grf | /data/DataCenter.ashx?data=Picture | 演示报表中的混和显示文字与图像，将明细网格的内容格设为自由格，实现图像与文字的混合排列。 |
| 1g.条形码与二维码 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/1g.grf | /data/DataCenter.ashx?data=Customer | 演示条形码与二维码，条形码数据将来自于关联的字段值。支持各种条常用的条形码与二维码。 |
| 1i.演示部件框自动布局 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/1i.grf | /data/DataCenter.ashx?data=Customer | 自动布局功能是开发自适应动态报表的重要方面。自动布局功能包括：停靠(Dock)、居中(Center)、对齐列(AlignColumn)、锚定(Anchor)。 |
| 1k.明细自由编排 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/1k.grf | /data/DataCenter.ashx?data=Customer | 将明细网格的标题格与内容格设为自由格，就可以像其它条幅式报表工具一样自由编排报表明细。 |
| 1l.交替色显示明细行 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/1l.grf | /data/DataCenter.ashx?data=Customer | 用两种背景色交替显示明细行的背景，通过设置内容行的“交替背景色”属性实现。 |
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| 2a.基本分组 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2a.grf | /data/DataCenter.ashx?data=SaleDetail | 一个最基本的分组报表，定义一个分组，并定义分组的“依据字段”属性。 |
| 2b.依据多个字段分组 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2b.grf | /data/DataCenter.ashx?data=Customer | 根据多个字段进行分组的报表，多个分组字段之间用字符“;”隔开。 |
| 2c.多级分组 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2c.grf | /data/DataCenter.ashx?data=Customer | 演示定义多个分组实现多级分组报表。 |
| 2d.分组单元格合并 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2d.grf | /data/DataCenter.ashx?data=Customer | 演示占列式分组报表，占列式分组其分组头不占据单独的显示行，也就是表格分组单元格合并。 |
| 2e.自定义分组单元格合并 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2e.grf | /data/DataCenter.ashx?data=Customer | 演示占列式分组，合并单元格内容在分组头中专门定义。 |
| 2f.多级分组单元格合并 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2f.grf | /data/DataCenter.ashx?data=Customer | 演示多级分组占列式分组报表。 |
| 2h.分组节显示列线 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2h.grf | /data/DataCenter.ashx?data=SaleDetail | 在分组头与分组尾中显示列线，通过显示部件框的左右边框并采用对其列定位来实现。 |
| 2l.分组按统计排序 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/2l.grf | /data/DataCenter.ashx?data=SaleDetail | 根据分组的统计值进行排序。 |
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| 4a.演示子报表 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/4a.grf | /data/DataCenter.ashx?data=SubReport_4a | 示子报表，在一个主控报表中显示多个子报表，实现多个报表的集中展现。 |
| 4b.独立子报表 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/4b.grf | /data/DataCenter.ashx?data=SubReport_4b | 独立子报表中每个子报表可以是不同的页面设置，可以导出到不同的Excel工作表。独立子报表的概念说明: 请参考帮助中的“开发指南->报表部件框应用->子报表”部分。 |
| 4c.子报表实现表中表 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/4c.grf | /data/DataCenter.ashx?data=SubReport_4c | 演示在内容格中查入子报表实现表中表。[设计子报表1][设计子报表2] |
| 4d.子报表主子关联 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/4d.grf | /data/DataCenter.ashx?data=SubReport_4d&city=天津 | 演示主子报表之间如何自动传递参数，子报表中的参数会自动从主报表中同名的参数或记录集字段中取值。 |
| 4e.子报表嵌套子报表 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/4e.grf | /data/DataCenter.ashx?data=SubReport_4e | 演示多级子报表，即子报表中包含下级子报表。 |
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| 5a.表达式运算 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/5a.grf | /data/DataCenter.ashx?data=SaleDetail | 演示用综合文字框实现运算表达式。 |
| 5b.显示行号序号 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/5b.grf | /data/DataCenter.ashx?data=Customer | 演示用系统变量显示行号及各种序号，将内容格设为自由格并插入系统变量框。 |
| 5c.层高不等多层表头 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/5c.grf | /data/DataCenter.ashx?data=Customer | 演示层高不等多层表头报表。 |
| 5f.无边框表格 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/5f.grf | /data/DataCenter.ashx?data=Customer | 演示一个没有表格边框线的报表。 |
| 5g.无行线表格 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/5g.grf | /data/DataCenter.ashx?data=Customer | 演示一个没有行线的表格报表，但标题行下显示一条水平分隔线，标题格为自由格，其中的静态框显示下边框。 |
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| 7-1a.脚本：追加空白记录 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-1a.grf | 在报表主对象的开始处理脚本上实现追加空白记录。 | |
| 7-1b.脚本：设置特殊显示文字 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-1b.grf | 在字段的“获取显示文字脚本”中为字段设置特殊显示文字。在文字类部件框上也可以实现类似的功能。 | |
| 7-1c.脚本：文字按条件突出显示 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-1c.grf | /data/DataCenter.ashx?data=SaleDetail | 在内容行的“格式化脚本”中实现文字按条件高亮显示。部件框的外观属性可以在其所处的报表节的格式化脚本上进行改变，这样可以根据不同的条件实现文字按不同的格式显示。 |
| 7-1d.脚本：整行突出显示 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-1d.grf | /data/DataCenter.ashx?data=SaleSumByProduct | 在内容行的“格式化脚本”中实现当前行整行按条件高亮显示。 |
| 7-1e.脚本：两行显示一次行线 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-1e.grf | /data/DataCenter.ashx?data=Customer | 实现按需显示表格的行线，将单元格改为自由格，然后在内容行的“格式化脚本”上按条件动态控制部件框的边框。 |
| 7-1h.脚本.按条件隐藏数据行 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-1h.grf | /data/DataCenter.ashx?data=SaleSumByProduct | 根据条件确定明细行是否显示。 |
| 7-2a.脚本：计算字段 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-2a.grf | 报表中可以插入计算字段，计算字段无实际数据源字段对应。在记录集的“提交记录前脚本”属性上写报表脚本，实现计算字段求值。 | |
| 7-2b.脚本：累计求和(收发存) | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-2b.grf | /data/DataCenter.ashx?data=SaleByProduct | 用报表脚本实现计算收入支出数据的结存余额。 |
| 7-2c.脚本：占列分组不重复求和 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-2c.grf | 用报表脚本实现主表数据项求和，每项只求和一次。 | |
| 7-3b.脚本：部件框自定义绘制 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-3b.grf | 演示部件框的自定义绘制功能。 | |
| 7-3c.脚本：部件框自绘(饼图与弧线) | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-3c.grf | 演示部件框的自定义绘制功能。 | |
| 7-3e.脚本：自定义条件分组 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-3e.grf | 分组不是根据某一个或多个字段的值的变化产生，而是根据自定义的规则产生分组项，这里是根据值的范围产生不同的分组。 | |
| 7-3f.脚本：按首字母分组 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/7-3f.grf | 按首字母进行分组。增加一个计算字段，在记录集的“提交记录前脚本”中将计算字段的值设为对应字段的首字母。 |
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| 8a.图表.序列组簇图 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/8a.grf | 各种序列组簇类型的图表，包括柱状图、饼图、连线图、混和图表、双轴图表等。 | |
| 8b.图表.XY数据型图 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/8b.grf | /data/DataCenter.ashx?data=Chart_8b | 各种散列(XY)类型的图表，包括散列点图、散列连线图、散列曲线图、气泡图表等。 |
| 8c.图表.三维(3D) | 仅HTML5报表 搭配客户端 搭配服务器 | grf/8c.grf | 各种3D图表等。 | |
| 8d.记录集图表 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/8c.grf | /data/DataCenter.ashx?data=Chart_8d | 图表全部定义对应记录集，图表的相关属性关联记录集的字段。 |
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| 9a.自由表格 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/9a.grf | /data/DataCenter.ashx?data=EmployeeOne | 用自由表格(FreeGrid)部件框制作一个人员档案自由表格。 |
| 9b.自由表格并明细网格 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/9b.grf | /data/DataCenter.ashx?data=FreeGridwithDetailGrid | 用自由表格部件框与明细网格共同实现一个有动态明细数据的自由表格。 |
| 报表名称 | 报表运行 | 报表模板 | 报表数据 | 说明 |
|---|---|---|---|---|
| a0.报表组件对象模型 | 仅HTML5报表 搭配客户端 搭配服务器 | grf/a0.grf | 用 Grid++Report 本身设计出其编程对象的组件对象模型图。 |
| 例子报表名称 | 简要说明 | 例子文件 |
|---|---|---|
| 起步例子 | 包含HTML5报表的js程序文件，设定报表显示占位HTML标签，定义报表显示对象并关联相关参数，显示一个HTML5报表只需短短几行代码。 | 01.Simple/ViewReport.htm |
| 按条件筛选报表数据 | 通过在报表数据URL中增加参数实现筛选条件传递给WEB服务器，按条件获取报表数据。 | 10.SummaryToDetail/Summary.htm |
| 报表中显示图像 | 各种类型图像数据显示在报表中。 | 05.Picture/Picture.htm |
| 汇总报表穿透(透视/Drilldown)查询 | 从汇总报表穿透查询到对应的明细报表，将当前双击行的记录数据作为穿透参数。 | 10.SummaryToDetail/Summary.htm |
| 交叉报表穿透(透视/Drilldown)查询 | 从交叉报表穿透查询到对应的明细报表，将当前双击行或单元格的记录关联数据作为穿透参数。 | 10.SummaryToDetail/Crosstab.htm |
| 搭配WEB报表客户端 | 利用WEB报表客户端实现报表打印、打印预览与数据导出。 | PlusWebApp/webapp-toolbar-bootstrap.htm |
| 搭配WEB报表服务器 | 利用WEB报表服务器的功能实现报表数据导出。 | PlusServer/server-toolbar-bootstrap.htm |
| 解决报表数据跨域 | 通过 General/CrossDomain.ashx 读取报表数据解决跨域问题。也可以通过 jsonp 方式解决，参考例子JsonpRport.htm。 | Advance/CrossDomain/CrossDomainReport.htm |