页面树结构
转至元数据结尾
转至元数据起始

正在查看旧版本。 查看 当前版本.

与当前比较 查看页面历史

版本 1 下一个 »

提示:本文档的示例代码仅适用于本文档中的示例报表/场景。若实际报表/场景与示例代码无法完全适配(如使用功能不一致,或多个宏代码冲突等),需根据实际需求开发代码。

问题说明

         在交互式仪表盘中,使用文本组件展示数据时,想实现类似跑马灯文字滚动的效果。

参考思路

        ①仪表盘中已经制作了文本组件,右键文本组件进入宏关联界面,对文本组件新建宏模块

②参考如下代码,在宏模块编辑界面进行开发。

跑马灯宏
function main(page: IPage, portlet: IStaticTextPortlet) {
    portlet.setContentHandler((rawHtmlContent, processedHtmlContent) => {
        // html:自定义宏文本html字符串
		//direction 是指滚动的方向;scrollamount是滚动的速度,数值越大滚动越快;h
        let html = '<marquee direction="left" scrollamount="5" onmouseover="this.stop()" onmouseout="this.start()" > ' + processedHtmlContent + '<\marquee>'
        return html
    })
}

点击 保存。重新访问报表,可看到效果已实现。



其他报表类型实现跑马灯文本滚动效果可参考:

①web电子表格:【web电子表格】实现跑马灯效果

②电子表格:电子表格跑马灯


  • 无标签