數據可視化分析之新技能——魔數圖
大家在使用數據可視化工具進行數據設計的時候，有沒有遇到過這些設計場景：部門人員的履歷細信息、工廠各個產線的生產狀態和生產信息、公司各個部門的KPI信息……這些數據都有一個共同的特點：數據結構相同，但是內容各有不同；佈局相同，但展示的樣式相同。在傳統場景中我們要實現這種需求，不能說做不到，只是實現起來比較繁瑣，我們要把數據一條一條的找出來，然後重複創建多個完全相同的圖表分別綁定對應的是數據。是不是聽着就腦殼痛。
那麼有沒有快速實現的方法呢？那必須有啊！今天我們介紹的就是我們Wyn 6.0 推出的全新組件——魔數圖。
本文將會從：① 適用場景；②場景分析；③使用案例；三個方面介紹魔數圖的使用方法。感興趣的小夥伴搬好小板凳。文末還有數據可視化大屏模板素材，免費發放，千萬不要錯過啊！
一、適用場景
魔數圖適用於所有的結構相同、重複顯示且佈局相同的數據。能夠快速、清晰的展示數據。
二、場景分析
魔數圖可用的場景有很多，我們列舉幾個常見的使用場景：
2.1展示倉庫的指標數據。
這是在是由化工行業中的應用，展示各個倉庫的狀態數據，如溫度、溼度以及對應的上限和下限指標。
2.2銷售人員業績展示。
展示銷售人員的業績完成情況，照片和每個月的銷售額。這也是一個典型的應用場景，每個銷售人員展示的信息完全相同，並且在展示時增加了一些圖表圖片，豐富了數據的展示形式；
2.3工廠訂單工序追蹤。
每個訂單具有不同的生產工序，每道工序都有自己的詳細信息。根據訂單信息關聯對應的而工序信息，
三、使用案例
在設計之前，我們需要先確定我們的使用場景是否適合我們的魔術卡，使用魔術卡。然後確定我們要展示的數據，並進行佈局設計。我們以上面的工廠訂單工序追蹤爲例，介紹魔數圖的使用設計全過程（不包括最後的背景樣式調整）。
3.1 創建數據源
3.1.1 數據結構設計
我們以Excel表格模擬生產時的數據源，分爲存儲訂單信息的“訂單列表”和存儲工序信息的“生產列表”兩部分：
3.1.2. 創建數據源
將Excel表格數據引入wyn（如下圖），然後全部都“下一步”，最後一步點“創建”；即可完成數據源的創建
3.1.3 查看數據源
我們創建成功之後，可以在數據源列表中看到數據源：
點進去就可以預覽我們的數據
3.2 創建數據集
在3.1中完成數據源的創建之後，我們就可以開始創建數據集了
- 通過訂單編號關聯表：
擊預覽數據（預覽正常然後保存數據）
3.3 創建圖表
前兩步都是在準備數據，當數據準備好之後，就可以開始使用我們的魔數卡組件啦。
3.3.1 創建魔數圖
在“圖表”中找到“魔數卡”組件，直接拖到繪圖區域即可：
3.3.2 綁定數據集
魔數卡的數據集，我們可以在儀表板設計器頁面綁定：
也可以在魔術卡的設計器面板綁定：
兩者沒有區別根據我們的習慣操作就行。
3.3.3 魔術卡設計
3.3.3.1 富文本
我們在圖表中添加一個“富文本”組件，然後在“插入表達式中”進行下圖中的設計：選中我們要展示的字段，然後選擇運算方式爲“第一個值”（我們這裏只做數據的展示，不做其他的任何運算）。然後重複這個操作將我們要展示的數據全部添加上：
在做一點點的樣式調整，內容居中顯示並且加一點背景色：
保存模板之後，返回儀表板進行預覽，效果如下，將我們的模擬數據全部展示了出來：
3.3.3.2 指示器
完成訂單數據設計之後，我們按照工序名稱，來顯示該工序的進度：
爲了統一樣式我們在爲治時期設置一下圖表樣式：
再做一些屬性設置：隱藏標題和副標題
最後的展示效果就成了這樣：
3.3.3.3 圖片
3.3.3.3.1 發佈圖片
這一部分，我們要先準備我們的圖片資源，我們模擬的數據中的圖片是我們通過wyn發佈出來的。在wyn的安裝目錄下找到 ” \Server\wwwroot\” 並創建 “\3d\sc“目錄，然後把我們的圖片解壓後放進去如下圖（也可以使用自己發佈的圖片，支要可以訪問即可）。
下載地址：
然後重啓我們的Wyn就能通過網絡訪問圖片了
3.3.3.3.2 添加組件
添加圖片組件，並未組件綁定數據：
然後把標識訂單狀態的圖片數據綁定上去：
最後把兩張圖片的文字說明，通過富文本展示出來，展示方式和3.3.3.1 中的方式相同：
3.3.4 效果預覽
至此，我們的魔術卡的設計就完成了，完整的預覽效果如下：
有些小夥伴預覽的效果可能不是這樣，而是下面這樣：
遇到這個不要慌，怎嗎解決呢，只要簡單的設置一下我們的條目佈局就好啦：
然後，就可以美美的預覽啦：
數據可視化大屏模板獲取：
https://gcdn.grapecity.com.cn/forum.php?mod=viewthread&tid=157030&extra=page%3D1
素材獲取關鍵字：大屏模板