报表实现滚动的公告效果

Dashboard 以丰富的动态、可交互的可视化界面为用户提供了更好的数据使用体验，让决策者可以更高效的了解企业的重要信息和细节层次。在 DBD 的各类动态效果中，滚屏是较为常见的一种，例以下图中的数据列表由于布局是固定的，所以就须要滚动显示数据。

一般报表中见到的滚屏是由于“页面大、窗口小”，也就是打开的窗口区域容纳不了整个页面的内容，须要靠键盘的方向键或鼠标滚轮来移动查看。而在 DBD 中，为了更好的交互效果，须要滚动自动持续进行，只有当鼠标移到该区域时才暂停。这种方式虽然说已经比较常见了，但通常来讲报表厂商却并无直接提供，而是须要经过 jquery,JS 来实现。如今我就给你们介绍一下如何实现这种文字滚屏效果。

咱们将在润乾报表设计器自带的“设备故障分析.rpx”基础上实现文字滚屏实例。

1. 数据集整理

对于从数据库读取的数据，能够经过集算器，将数据整理成下面截图中的效果。为了方便作效果，这里我直接将 ds2 这个内建数据中的全部字段的值整理到“设备”这个字段中，而且在里面加上了些空格，以便页面上缩进的效果好看些。

2. 合并单元格

将 G15 列删除，B15—F15 选中，合并。

3. 单元格数据类型设置为 html

4. 设置单元格表达式，如上图所示。下面是具体的表达式。

=“”+replace(string@q(ds2.select( 设备)),“,”,“
”)+“”

其中：

onmouseover=this.stop() 表示当鼠标以上区域的时候滚动中止；

onmouseout=this.start() 表示当鼠标移开的时候继续滚动。

5. 调整样式

原 B15-F15 设置了各行异色，由于咱们的文字滚动项做为统一的一串内容，因此按照以上设置，效果感受会有些突兀，以下图所示。

去掉 B15-F15 背景色的设置，这样滚动区域就总体浑然一体。

 

通过以上步骤咱们的数据列表就在 DBD 面板中滚动起来了，而且当鼠标指向数据的时候就会中止滚动，鼠标移开的时候就继续滚动了，这样的交互效果无疑会为你的大屏展示锦上添花。

上面这个小例子简单实现了文字滚动显示的效果。下面我具体讲解下看似神奇的标签的各个属性值，相信看事后必定会帮助您实现更好的文字滚动效果：

 

另外，您也能够将 <marquee> 和 </marquee> 之间的内容替换成图像或其它对象。

怎么样，是否是您已经在摩拳擦掌跃跃欲试了？别犹豫，让咱们一块儿来丰富 Dashboard 效果，让页面效果动起来吧！