动画数字

在仪表板中除了使用系统已有的可视化组件之外，还可以通过内置扩展插件，甚至自定义插件绘制更多样化的图表以更丰富的形式展示数据。
版本更新记录

版本号	更新内容	支持Wyn Enterprise版本	下载地址
V1.0	第一次发布	3.0.04167.0	动画数字.zip (21.66 KB, 下载次数: 137) 2020-2-15 00:06 上传 点击文件名下载附件

1. 内容概述
大屏展示中，经常需要动态显示一组变化的数字。
本节即将为您介绍的动画数字插件不仅可以实现动态显示数字，并且在数字发生变化时支持翻转，滑动等时尚酷炫的切换效果，这将大大提高屏显的整体活力和吸引力。
另外，动画数字还支持与其他组件的数据交叉联动，非常适合创建数据大屏、管理驾驶舱等场景。
本贴为您介绍扩展组件动画数字的基本用法。




2. 操作步骤
(1)  下载插件包
下载动画数字插件包，将其保存到本地计算机并解压。

(2)  添加外部扩展插件
将解压后的文件夹放置到Wyn Enterprise安装目录Server\wwwroot\Web Contents\   路径下即可在产品中体验
例如: D:\Wyn Enterprise\Server\wwwroot\Web Contents\


(3)  新建仪表板添加外部扩展组件
将外部扩展组件拖拽到仪表板编辑区。


(4)  选择插件
单击组件右上角进入编辑状态，选择“动画数字”，然后单击“确定”。


(5)  数据绑定
添加外部扩展组件后，“数据绑定”面板会自动打开，将数据集中的字段拖拽到绑定区即可完成数据绑定。
如果仪表板中未加载数据集，则需要先选择一个数据集进行加载，然后再绑定数据字段。详见加载数据集。

注意
数值绑定区中可绑定多个字段，但组件中仅显示绑定字段后的第一条数据。
可以通过为组件添加过滤器来控制数据的显示范围。

(6)  属性设置
在编辑区右侧选择“属性设置”进行图形样式设置。

自定义属性设置说明如下：

1. {
   
2.     "digit": {
   
3.         "animationDuration": 1,
   
4.         "animationMode": "slide",
   
5.         "decimalLength": 0,
   
6.         "integerLength": "auto",
   
7.         "showThousandSign": true,
   
8.         "backgroundColor": "",
   
9.         "font": {
   
10.             "color": "",
    
11.             "size": "auto",
    
12.             "family": "",
    
13.             "bold": false,
    
14.             "italic": false
    
15.         }
    
16.     }
    
17. }

复制代码

1.“animationDuration”：动画时长，单位为“秒”。设置数字切换时动画的持续时间，仅“slide”模式支持此设置项。设置为“0”时，表示无动画效果。 2.“animationMode”：动画模式，支持'slide'（滑动）, 'flip'（翻转）两种模式。当设置为“slide”模式时，可设置动画时长。 3.“decimalLength”：小数位数控制。 4.“integerLength”整数位数控制。 可设置为'auto'或者实际的位数。设置为“auto”时根据实际数字显示，数字前不会出现空白位数； 设置为整数位数时，当设置的位数大于实际数字位数时，则在数字前补0。 比如实际数字是3656952，将整数位数设置为“9”，那么最前面有两个0补充，显示为003656952。 5.“showThousandSign”是否显示千分符。 6.“backgroundColor：”设置背景颜色，如“blue”、“red”等。有关颜色名称，请参考https://www.runoob.com/cssref/css-colornames.html。 7.“font”：设置字体样式，包括颜色、大小、是否加粗和是否斜体。

(7)  预览并保存仪表板
预览后如效果满意，即可保存仪表板。