报表怎样实现滚动的公告效果?

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

 

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

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

  1. 数据集整理

对于从数据库读取的数据,可以通过集算器,将数据整理成下面截图中的效果。为了方便做效果,这里我直接将ds2这个内建数据中的所有字段的值整理到“设备”这个字段中,并且在里面加上了些空格,以便页面上缩进的效果好看些。

 

  1. 合并单元格

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

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

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

="<marquee direction='up' scrollamount='6' οnmοuseοver='this.stop()' οnmοuseοut='this.start()'>"+replace(string@q(ds2.select(设备)),",","<br>")+"</marquee>"

其中:

οnmοuseοver=this.stop()表示当鼠标以上区域的时候滚动停止

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

  1. 调整样式

原B15-F15设置了各行异色,因为我们的文字滚动项作为统一的一串

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值