導讀
數據時代一個顯著特徵是數據可視化的崛起，被譽爲大數據分析應用領域裏的最後一公里，數據可視化將數據分析、工程技術與設計藝術結合，藉助圖形化的手段，用比文字快十倍甚至萬倍的速度清晰有效地傳達信息，讓人們可以利用人類經歷漫長進化得來的強大視覺化思考本能去對所呈現數據進行挖掘、整合，得以輔助分析和決策。
早在 300 年前折線圖、柱形圖、餅圖被髮明，時至今日有了紛繁多樣的數據可視化表現形態，而生產方式也從原始手繪到今天可以通過代碼、工具自動生成，數據可視化領域跟過去相比已經有了翻天覆地的變化，特別是最近10年，隨着 D3（D3: Data-Driven Documents IEEE InfoVis 2011） 以及大量統計圖表類庫和工具出現，讓數據可視化設計和生產門檻大幅降低。
伴隨數據可視化的價值越來越被人們認可以及生產工具的普惠，越來越多設計師、工程師、產品經理開始接觸這個領域，甚至可以說在現代化的 Web 系統中已經很少有不含任何數據可視化成分。作爲這個專業領域的研發人員，我們一直在思考如何讓這個研發成本更低，在如今可視化類庫已經工程成熟、理論完備的當下，也許可以往智能化方向去尋求突破。
於是有了接下來想跟大家分享的一個智能可視化體系，AVA。可以讀作「 阿瓦 」，字母 VA 是 Visual Analytics 的縮寫，表示可視分析，而第一個 A 是一個向量，有很多涵義，可以是 Alibaba 表示阿里巴巴集團多個專業可視化團隊聯合共建，可以是 AI、Automated 又或者 Augmented，表示人工智能、自動化和增強分析。
我們希望提供一個智能、自動化的可視化分析黑盒子，只需要提供數據本身和分析意圖，合適的圖表或可視表達就能夠自動被推薦和生成出來了，所有中間的環節，AVA 都能幫大家處理掉。
要做到這個理想模式還需要大量的工作，而聚焦當下面對可視化研發階段的痛點，我們有了一些階段性成果可以跟大家做個分享，希望能聽到大家的建議和意見。
我們在思考，今天的數據可視化設計、研發方式就足夠的好了嗎？這過程我們還會遇到什麼麻煩？
昨天那些似曾相識的情景今後不再有了
萬事俱備，就差我看完文檔了
作爲一個前端，最幸福的項目研發狀態莫過於「人員齊備、接口到位、需求定好、設計定稿」，萬事俱備我們擼起袖子就可以開幹了。但別急，如果涉及到數據可視化，特別是很幸（bu）運（xing）的發現設計稿裏的圖表蘊含設計師不甘平庸的個性化定製，不好意思，你得看完並搞懂那數十個 API 以及數百個可以無窮組合的配置項，試出你想要的效果。
更別說萬一涉及到那些初次見面或者當年畢業就已經還給老師的東東~
可視化輔助可視化研發
在 Low Code / No Code 可視化 UI 輔助前端研發盛行的今天，可視化研發居然還沒有一個可視化 UI 去輔助研發？抱歉，我們來晚了。
通過 AVA 的可視化智能研發能力，我們希望工程師只需要寫一個 API 調用，剩下的一切調整都能通過可視化 UI 去完成，就像你不需要去看蘋果產品的產品使用說明一樣，在你啓用的那刻就學會了如何使用。
你可以通過下面這行代碼，傳入數據，指定圖表類型，即可在頁面上喚起 AVA 研發態的可視化 UI 配置面板：
AVA.autoChart(container, data, { config: { type: 'line' }});
不用再去看圖表類庫的文檔，AVA 語義化的 UI 面板現已支持 100+ 圖表選項修改並且還將持續增強，自由調整，即時生效。調整完成，拷貝配置到代碼，開發就完成了。
完整演示見分享視頻
如果你的設計沒問題，那一定是我用的圖表庫有問題
遭遇高端細節需求的時候，設計師同學經常會遇到各種靈魂拷問，「 這樣的設計符合可視化設計規範嗎？」、「 畫得出來就一定能開發出來嗎？」，於是就是反覆的設計合理性、技術可行性溝通、反覆的改稿、上線後還要去做設計還原對比？
設計到研發鏈路打通，設計還原零失真
通過代碼在研發時喚起 AVA 的可視化 UI 配置面板去還原設計稿，這是給前端工程師的專屬武器，但如果設計師、產品經理也是用 AVA 的能力去做設計搞，工程師又何必動武呢？
沒錯，聰慧的你已經逐漸看清 AntV 產品矩陣上的棋盤了，不久前我們已經發布上線的 ChartCube 正是爲此準備，這是給設計師、產品經理準備的專屬武器，從 ChartCube 到 AVA，設計到研發鏈路打通，設計合理性、技術可行性無需反覆溝通，中間產物可以被無縫連接，設計還原零失真。
完整演示見分享視頻
哪有萬事俱備，通常我只知道畫個什麼圖
做過業務研發的前端同學都深諳其道，雖然我知道要畫一個什麼圖表也懂得怎麼去開發這個圖表，但不到聯調哪一天數據接口都不會 Ready 的，我需要腦補一份這個圖表背後的數據應該長成什麼樣，然後跟後端同學溝通數據接口，接着自己去構建一份 Mock 數據。
這有多難？對有數據經驗的你說難，不難，但沒數據經驗的同學可能平表（Tabular）和交叉表（Crosstab）不分，自定義的 Mock 數據並不規範，真正聯調時才發現需要增加大量數據處理工作。
從圖表類型選擇到研發態數據準備，一切就緒
AVA 智能研發可以開啓智能嚮導模式，從一行萬能代碼開始
AVA.autoChart(container, []);
你無需任何額外的參數輸入，會看到 AVA 的研發嚮導，選擇「從圖表類型開始」，選擇需要的圖表類型，接下來的事情你在上面已經看過了，拷貝數據和配置回到代碼裏，你圖表部分的開發工作在寫完這一行代碼和兩次複製粘貼的動作後就已經結束了，把數據格式告訴後端，等着他接口 Ready 聯調就好。
完整演示見分享視頻
還萬事俱備？我接的還有一句話需求
數據沒有準備好是常態，有設計就不錯了，我知道很多時候我們甚至連設計都沒有，我們的同學就接過一整頁數據監控報表的需求說明裏只有一句話，“**管控平臺三期需要新增一個 Tab，給用戶提供系統運行情況的數據分析，目前系統能採集到的元數據見列表”，然後就留下在風中凌亂的你~
從數據特徵到智能圖表推薦，萬事俱備
先說說數據，根據 data schema 去構造 Mock 數據有多疼？
說不疼也不疼，7、8個數據不就是 ctr+c、ctr+v 嗎？說疼也很疼，你是沒遇到過要構建近5年全年分日銷售數據？或者要分類交叉枚舉全國34個省級行政區域數據？更別說如果還要求這組數據帶有某些如均值、方差、偏態分佈的統計特徵？
說不疼也不疼，7、8個數據不就是 ctr+c、ctr+v 嗎？說疼也很疼，你是沒遇到過要構建近5年全年分日銷售數據？或者要分類交叉枚舉全國34個省級行政區域數據？更別說如果還要求這組數據帶有某些如均值、方差、偏態分佈的統計特徵？
不管是 Mock 還是真實數據，有數據又怎麼樣？圖表選擇困難症，什麼樣數據該用什麼樣的圖表展現？君不見 WTF Visualizations 上無數腦殘的表現方式出現在我們的產品設計中。
不同的數據，不同的分析意圖選擇用什麼樣的圖表來表達本身就是一門學問，這領域的專家、學者已經總結出很多經驗工具，比如這張很有經典的決策樹。
沒有一種圖表類型是萬能的，每一種圖表類型都有他適用的場景，甚至有些時候明明是正確的圖表選型，在數據發生變化後突然變成不對了也是常有發生，簡單舉個例子，比如大家熟悉的餅圖，下面這是兩組數據，用了兩個餅圖去顯示，不管是兩組數據自身的構成比例還是兩組間的對比都特徵顯明：
而突然有一天你發現數據變化後，變成這樣了：
餅圖在這個時候就完全沒 point 了，而如果變成柱形圖，你就會有不一樣的發現：
這就是圖表選擇的門檻與藝術，希望 AVA 能解決這個問題，還是從那一行萬能代碼開啓 AVA 智能研發嚮導：
AVA.autoChart(container, []);
你會看到 AVA 的研發嚮導，選擇「從數據特徵開始」，僅需數據特徵即可自動生成 Mock 數據，爲可視化研發提供研發態數據準備。應用到當前圖表中，智能圖表推薦將出現，選擇需要的圖表類型，接着就又回到那熟悉的流程。
完整演示見分享視頻
智能圖表推薦
「對的數據」要配「對的圖表」，智能圖表推薦能力建立在可視化領域學者的諸多學術研究成果之上，結合了大量專家經驗以及 AntV 多年來的圖表使用規則的最佳實踐，關於 AVA 智能圖表推薦原理涉及到的知識庫、推薦規則與推薦器實現，我們會在後續文章中詳細介紹，期待你的關注。
明天會是怎麼樣？
當前的可視化智能研發是 AVA 版圖中很重要的組成部分，但還處於很初級的階段，只能滿足基本的研發訴求和業務場景。明天會是怎麼樣？在我們的規劃裏還有長長的功能列表等待我們去實現，很多讓人興奮的能力讓我們充滿期待，希望他能指引我們進入到下一個數據可視化時代。
研發態：全智能圖表推薦，代碼極簡
當前智能圖表推薦會產出配置項代碼，需要我們拷貝至代碼中以穩定圖表展示方式，雖然相比以前已經大幅提高了研發效率，但依舊繁瑣。而之所以需要拷貝回代碼中，源於我們當前推薦算法還不完善，而我們相信，隨着算法代碼的不斷優化，在不久的將來，我們很多場景都可以僅需一行極簡的代碼，完全依賴智能圖表推薦輸出就能滿足我們的業務研發需求。
閱讀態：交互分析組件智能增強
前面描述的都還是研發態的智能輔助，而 AVA 的目標還會延伸到閱讀態，最典型的就是交互分析組件的智能增強。簡單點的比如說 Slidebar 的動態出現，我們可以根據當前圖表類型以及顯示空間的大小，計算可視化的有效顯示負荷，並隨着圖表需要渲染的數據量的變化動態決定是否出現 Slidebar 去做交互分析的增強。更復雜的我們可以自動做關聯圖表的聯動，在適合的場景下自動開啓聯動刷選、下鑽、動態圖表類型等能力。
分析態：運行時的可視分析智能輔助
更進一步，不管是靜態展現還是動態交互，目的都是爲了分析，AVA 延伸到閱讀態的最終目標是幫助人們更好的獲得數據洞察，所以 AVA 未來會做運行時的可視分析智能輔助，比如自動識別出趨勢、迴歸、奇異點等統計特徵，實現自動演示模式的 Storytelling 能力透出去更高效的幫助人們解讀數據。
結語
AVA 由螞蟻金服 AntV & DeepInsight、新零售技術事業羣 FBI、盒馬 Kanaries 等阿里巴巴集團內多個核心數據可視化技術和產品團隊聯合共建，包含前後端工程、算法與模型，隨着能力完善將逐步對外公開並以開源方式運作，期待大家的關注與參與，歡迎任何的建議或意見。
- AntV 官網：https://antv.vision
- G2：https://github.com/antvis/g2
G2 是一套基於可視化編碼的圖形語法，以數據驅動，具有高度的易用性和擴展性，用戶無需關注各種繁瑣的實現細節，一條語句即可構建出各種各樣的可交互的統計圖表。 - g2plot：https://github.com/antvis/g2plot
g2plot 的定位是開箱即用、易於配置、具有良好視覺和交互體驗的通用圖表庫。 - F2：https://github.com/antvis/f2
F2 是一個專注於移動，開箱即用的可視化解決方案，完美支持 H5 環境同時兼容多種環境（node, 小程序，weex）。完備的圖形語法理論，滿足各種可視化需求。專業的移動設計指引爲你帶來最佳的移動端圖表體驗。 - G6：https://github.com/antvis/g6
G6 是 AntV 旗下的圖可視化與圖分析引擎，G 來自於 Graphic、Graph ，意味着我們要基於圖分析技術做圖可視化；6 來自於《六度分隔理論》，表達了我們對關係數據、關係網絡的敬畏和着迷。 - Graphin：https://github.com/antvis/graphin
Graphin 是一個基於 G6 封裝的關係可視分析工具 ，簡單，高效，開箱即用，取自 Graph Insight，圖的分析洞察。 - L7：https://github.com/antvis/l7
L7 是一個基於 WebGL 的開源大規模地理空間數據可視分析開發框架。L7 中的 L 代表 Location，7 代表世界七大洲，寓意能爲全球位置數據提供可視分析的能力。 - G：https://github.com/antvis/g
G 是 AntV 幾個產品共同的底層 2D 渲染引擎，高效易用，專注於圖形的渲染、拾取、事件以及動畫機制，給上層 G2、F2、G6 提供統一的渲染機制。 - ChartCube：https://chartcube.alipay.com
ChartCube 是一個可以快速完成圖表製作的在線工具，只需要三步就可以創建出高品質的圖表。 - AVA：https://github.com/antvis/AVA
AVA 是一個智能可視分析框架，包含研發時的智能研發嚮導，閱讀時的智能交互增強，可視分析時的智能輔助。 - 最新動態
- 2020.01.04 SEE Conf 2020 - 智能可視化體系 AVA
- 2019.11.22 知源 · 致遠 - AntV 11.22 年度發佈