在做視覺化資料時經常用到圖表，這次為大家分享用中繼器做一個簡單的動態柱狀排名圖。

預覽及下載地址：https://7v5ukn.axshare.com

一、製作原型

1.製作10個文字框，分別命名為：text1，text2……text10

2.製作10個條形，分別命名為：1、2、……10

3. 製作一箇中繼器

4.設定中繼器數值

二、互動設定

設定中繼器為隱藏狀態

1、設定text的值的，觸發中繼器的“每項載入時”事件，新增判斷條件，如果NO=1時，設定text1的值為[[Item.text]]（中繼器中的text列的值），如果NO=2時，設定text2的值為[[Item.text]]……如果NO=10時,設定text10的值為[[Item.text]],下圖以text1為例，

2.設定條形圖的尺寸以及動態效果

設定條形的尺寸以及動態效果，觸發中繼器的“每項載入時”事件，新增判斷條件，如果NO=1時，設定1的尺寸寬值為[[Item.column]]（中繼器中的column列的值），高度不變（初始設定為15），錨點:左上角，動畫：線性，時間500（為了動態效果更明顯第一個500，第二個1000，以此類推），以條形1為例

最後的互動設定為：