一鍵解鎖新玩法：有了這份“設(shè)計(jì)秘笈”，讓你的報(bào)表高端又中用

隨著技術(shù)的發(fā)展，越來越多的用戶開始關(guān)注大屏報(bào)表甚至自助式分析下的炫酷效果，良好的圖表展現(xiàn)以及動(dòng)態(tài)效果讓用戶更易理解數(shù)據(jù)，對(duì)數(shù)據(jù)更感興趣。而在Yonghong即將發(fā)布的版本中，對(duì)這一能力有了全面的提升——?jiǎng)赢嫛?/p>

一、裝載動(dòng)畫

新版本我們對(duì)組件加載動(dòng)畫進(jìn)行了效果和性能優(yōu)化，視覺效果更加自然順暢。

話不多說，直接上圖。

不同圖表的加載動(dòng)畫效果會(huì)有所不同，以達(dá)到最佳的視覺效果。

二、過渡動(dòng)畫

大屏展示或者自助式分析（例如過濾，筆刷，縮放，組件傳參等）時(shí)，用戶往往需要對(duì)前后的數(shù)據(jù)進(jìn)行對(duì)比，如果圖形缺少連續(xù)流暢的變化過程，會(huì)大大增加數(shù)據(jù)對(duì)比難度，很難直觀看出前后差異或者數(shù)據(jù)變化。因此連續(xù)且流暢的動(dòng)畫顯得尤為重要。

下面以過濾為例，看看新版本中柱圖、點(diǎn)圖、線圖數(shù)據(jù)變化的過渡效果。

（柱圖）

（堆積柱圖）

（點(diǎn)圖）

（線圖）

（面積圖）

如上圖所示，如果圖形顯示了標(biāo)簽，標(biāo)簽也會(huì)跟著移動(dòng)，并且數(shù)值標(biāo)簽會(huì)有數(shù)字翻動(dòng)動(dòng)畫。

動(dòng)畫可以關(guān)閉，也可以自定義時(shí)長(zhǎng)，通過【報(bào)告】-【設(shè)置】進(jìn)行修改。

三、動(dòng)畫進(jìn)階

結(jié)合腳本，三步便可實(shí)現(xiàn)圖表連續(xù)動(dòng)態(tài)變化的效果。以下圖表數(shù)據(jù)為模擬數(shù)據(jù)。

第一步，新建空白報(bào)告，拖入柱圖組件，綁定數(shù)據(jù)，設(shè)置高級(jí)排序TOP10。

第二步，拖入下拉參數(shù)組件，并綁定數(shù)據(jù)，對(duì)柱圖組件設(shè)置過濾器。

第三步，設(shè)置報(bào)表刷新間隔為2s，動(dòng)畫時(shí)間2000ms。添加報(bào)表參數(shù)“i”，默認(rèn)值設(shè)置為0，并添加腳本如圖。

預(yù)覽報(bào)告，效果如下：

fqj