inMap

inMap是TalkingData可視化團隊開源的一款基于 Canvas 的大數(shù)據(jù)可視化庫，專注于大數(shù)據(jù)方向的散點、熱力圖、網(wǎng)格、聚合等方式展示，致力于讓大數(shù)據(jù)可視化變得簡單易用。

它具有以下特性：

• 高性能

• 多線程

• 多圖層疊加

• 友好的 AP

• 可以自定義主題

inMap 采用更加智能的地理可視化框架，主要面向從事數(shù)據(jù)可視化應(yīng)用相關(guān)的工程師和設(shè)計師。

底層繪圖引擎：目前基于 canvas 2d 提供基礎(chǔ)繪圖能力，基于 WebGL 的版本正在規(guī)劃中；

算法：內(nèi)置了經(jīng)緯度墨卡托轉(zhuǎn)換、文字避讓算法、***標記點算法、自動分組標記配色算法等。

inMap 的每個算法都是為了增強用戶體驗，追求***效果，打造偉大的產(chǎn)品。

inMap 的接口設(shè)計非常友好，希望讓開發(fā)者通過簡單的配置，就能快速構(gòu)建出優(yōu)美的可視化效果。

官網(wǎng)：http://inmap.talkingdata.com

GitHub：https://github.com/TalkingData/inmap

iView

iView 是TalkingData可視化團隊開源的一套基于 Vue.js 的 UI 組件庫，主要服務(wù)于 PC 界面的中后臺產(chǎn)品。

它具有以下特性：

• 高質(zhì)量、功能豐富

• 友好的 API ，自由靈活地使用空間，面向任何技術(shù)水平的開發(fā)者

• 細致、漂亮的 UI

• 事無巨細的文檔

• 可自定義主題

同時 iView 也是一整套的前端解決方案，包括了設(shè)計規(guī)范、多語言（目前 iView 支持 15 國語言）、自定義主題、服務(wù)端渲染。

iView 支持 Vue.js 2.x、Vue.js 1.x、服務(wù)端渲染、Nuxt.js、Electron等。

iView 目前在 GitHub 上有 13,000 多 star，從 star 數(shù)量、口碑和功能性、UI / UE上，iView 都排在全球同類產(chǎn)品的 Top3。

官網(wǎng)：https://www.iviewui.com

GitHub：https://github.com/iView/iView

iView 新版本發(fā)布

在過去的兩個多月里，iView 陸續(xù)發(fā)布了 2.9.0 和 2.10.0 兩個重要版本。這兩個版本總共有 255 個 commit，超過 40 項更新。來看一下，iView 具體有哪些更新：

一、日期組件 DatePicker 的重構(gòu)

首先是在 2.10.0 對日期組件 DatePicker 的重構(gòu)。DatePicker 是 iView 48 個組件里最復(fù)雜的組件之一。復(fù)雜的功能使得代碼邏輯非常重，在許多新特性的支持上，比如兼容不同國家的日歷規(guī)范等都很難在此基礎(chǔ)上迭代，不得不推倒重來。

SergioCrisostomo 之前有開發(fā)過日期相關(guān)的 JS 庫（https://github.com/SergioCrisostomo/js-calendar），所以對日期相關(guān)的功能點和 API 非常熟，iView 也是基于此庫進行的重構(gòu)。

新的日期組件主要增加了以下功能：

1. 范圍選擇支持從右往左選擇。

之前在范圍選擇時，必須先選起點，再選終點，也就是從左往右選，但很多用戶的習慣卻剛好相反。該版本則同時支持兩個方向的選擇。

2. 新增 split-panels 屬性，開啟后，左右兩面板可以不聯(lián)動。

之前在范圍選擇時，左右兩個面板是聯(lián)動的，也就是右邊永遠比左邊大一個月，任何一個面板切換月份或年份，另一個面板都會自動切換。該版本則可以設(shè)置為不聯(lián)動，這樣方便定位起始月份和結(jié)束月份。如圖所示：

3. 新增 multiple 屬性，開啟后，可以選擇多個日期。

雖然之前版本可以用其它 iView 組件組合出來一個多選的日期，但效果和交互多少會打折扣，該版本只要增加屬性 multiple，就可以在一個日期面板上同時選擇和呈現(xiàn)多個日期了。如圖所示：

4. 新增屬性 show-week-numbers，開啟后，可以顯示星期數(shù)。

增加這個屬性，就可以在日歷面板上顯示當前是一年的第幾周。如圖所示：

還有其它很多項的更新，比如新增 start-date 屬性，可以設(shè)置面板展開時默認顯示的日期。新增屬性 time-picker-options，可以在 type 為 datetime 和 datetimerange 下，配置 TimePicker 的屬性，比如時間間隔 steps。完整的更新可以產(chǎn)看更新日志，這里不一一列舉了。

二、鍵盤可訪問性的支持

鍵盤的可訪問性，主要是通過鍵盤的方向鍵、tab鍵、空格鍵等完成表單組件的切換和交互。在填寫一個表單時（iView Form 組件），尤其有用，你可以離開鼠標，就完成一個復(fù)雜表單的填寫與提交。

目前 iView ***版本支持鍵盤可訪問性的組件有：

Button、Input、Radio、Checkbox、Switch、AutoComplete、Slider、InputNumber。更多組件還在陸續(xù)支持中。

事實上，原生的表單控件，瀏覽器都是支持鍵盤的可訪問性的，比如 <button>、<input type="radio"> 等等。iView 對這些原生控件進行了重塑，不僅僅使得 UI 好看和統(tǒng)一，更重要的是功能的豐富和交互體驗的提升。

目前上述的組件，都是可以通過鍵盤的 tab鍵 選中的，這是***步，如圖所示：

可以看到，組件在被選中時，外面多了一個高亮層，表明當前選中的控件，這時就可以通過鍵盤其它按鍵繼續(xù)操作了，比如單選組件 Radio，在選中狀態(tài)下，可以通過鍵盤的方向鍵直接切換選項；Checkbox 在被激活時，可以通過空格鍵選擇和取消選擇某小項，通過 tab 鍵激活下一個小項。

三、其他更新

還有一些更新，是無法直接看見和體會到的。

比如更新了大量的依賴：

• babel 系列全部更新

• 使用了 browserslist

• 使用了 sourcemap

部分組件的重構(gòu)，雖然功能無任何變化，但代碼結(jié)構(gòu)和邏輯都做了優(yōu)化和可維護性設(shè)計。

還有部分組件的自動化測試、持續(xù)集成對 GitHub travis-ci 的兼容等等。

外表需要優(yōu)化，內(nèi)部同樣也是，就像一個人，既要有外在美，也要有內(nèi)在美。

這兩個版本都需要感謝兩位瑞典大神 SergioCrisostomo 和 Xotic750 的貢獻，iView 才得以越來越完善。

完整的更新日志可以到 GitHub releases 查看：

2.9.0: https://github.com/iview/iview/releases/tag/v2.9.0

2.10.0: https://github.com/iview/iview/releases/tag/v2.10.0

數(shù)據(jù)可視化可以很簡約，但也可以很酷炫，別讓工具限制了你的想象力！