全部產品
Search
文件中心

DataV:設計庫

更新時間:Nov 19, 2024

本文介紹設計庫的概念、資產分類和如何使用設計庫製作可視化大屏。

說明

設計庫功能為7.0版本產品新增功能,請根據新版控制台環境進行操作。

什麼是設計庫

DataV基於使用者搭建可視化大屏的標準鏈路,協助使用者快速檢索可視化大屏所需要的模組單元,方便使用者通過拖拉拽的方式,在標準的設計規範下,做出高品質設計水平的可視化大屏。那設計庫和組件庫有什麼區別呢?組件通常包含了一套預設樣式,難以同時滿足各類使用情境。在設計庫中,每一個標題、面板、地圖都經過了設計師精心配置和最佳化,風格任意挑選、開箱即用、自由組合,大大提升了大屏搭建效率。

可視化套件類型

由於使用者在設計過程中,常常在建立專案時會使用模板建立,但是單個模板擁有的資料面板或者地圖,往往不能滿足使用者多元化的情境需求。當使用其他模板中的素材時,又會遇到風格不匹配的問題,導致頁面的拼湊感嚴重,影響美觀。DataV在設計庫中推出5款可視化套件:晴山藍丹霞橙暮山紫碧璽綠雲峰白。您可以單擊頁面左上方的全部下拉式功能表選擇需要使用的可視化套件。image.png

可視化套件內容

每種可視化套件均包含以下內容,方便使用者的選擇。例如:碧璽綠。

  • 大屏模板:此處分別展示了地區地圖模板、中國地圖模板和3D地球模板,滿足使用者適配不同的使用情境。image

  • 地圖:此處展示了多種地圖樣式,包括但不限於平面地區地圖、3D省份地圖、3D中國地圖和3D地球,在修改大屏模板內的地圖時可以自訂替換。未來我們將實現更多的地圖樣式,敬請期待。image

    • 平面地區地圖image

    • 3D省份地圖image

    • 3D中國地圖image

    • 3D地球image

  • 資料面板:此處展示了常用的資料面板類型,包括但不限於數字翻牌器、餅環圖、折線柱狀圖和進度條指示圖等類型。您可以選取部分內容補充到自訂大屏,也可以更換樣式、顏色等配置項。image.png

  • 標題:此處展示了常用的標題組件類型,包括但不限於一級標題、二級標題和三級標題。您可以快速選擇並更換到大屏中,滿足您的設計要求。image

  • 設計規範:此處展示了當前可視化套件類型下的主視覺布局文字規範色彩規範。您可以根據要求選擇需要的資產類型添加到畫布中。

    • 主視覺布局樣本image

    • 文字規範image

    • 色彩規範image

  • 素材:此處展示了可視化大屏中常用的素材類資產,包括但不限於模型、視頻、表徵圖、點綴、背景圖、背景框、裝飾條和插畫。image

    說明

    可視化套件下暫未區分素材類型,請在左上方的下拉式清單選擇全部進行查看。

  • 我的資源:此處展示了工作台下的設計資源內容,您可以直接單擊或拖拽至畫布中使用。image

    說明

    當前模組內容不受可視化套件類型的影響。

  • 我的收藏:此處展示了工作台下的組件收藏內容,已收藏的組件會儲存在當前模組,您可以直接單擊或拖拽至畫布中再次使用。image

    說明

    當前模組內容不受可視化套件類型的影響。

案例示範

本案例介紹通過使用可視化套件如何快速搭建資料大屏。

  1. 登入DataV控制台

  2. 工作台頁面,將滑鼠移動到建立PC端看板上,單擊選擇模板

  3. 建立看板頁面,選擇空白看板,單擊建立看板

  4. 輸入看板名稱後,單擊建立看板

  5. 在左側導覽列單擊設計庫,進入設計庫頁面。image

  6. 單擊設計庫頁面左上方的全部,在下拉式清單中選擇碧璽綠image

  7. 單擊設計規範,選擇主視覺置中布局image

  8. 單擊地圖,在主地圖地區插入3D省份地圖。拖拽編輯地圖大小鑲嵌到主地圖地區。image

  9. 單擊標題,在背景塊添加標題組件。查看自訂背景塊的尺寸大小,將標題組件契合在背景塊上方。image

  10. 單擊資料面板,選擇需要添加的資產。分別調整每個資產的尺寸和樣式,貼合在自訂背景塊上方。image

  11. (可選)在素材中選擇需要添加的資產,美化完善數字大屏。

  12. 完成設計後,單擊畫布編輯器頁面右上方的預覽,預覽數字大屏。image

視頻示範

視頻展示了關於地圖類大屏的示範流程,僅供參考。您也可以根據自己的使用習慣,靈活的使用套件中的各類元素。

面板功能

設計庫面板的上方,您可以做以下操作。

  • 單擊image表徵圖,重新整理設計庫頁面。

  • 單擊image表徵圖,開啟快捷搜尋面板,直接輸入需要查詢的設計組件即可。

  • 單擊image表徵圖,關閉設計庫面板。