資訊專欄INFORMATION COLUMN
摘要：本文作者可視化工程師李鳳祿是可視化團隊開源的一款基于的大數據可視化庫，專注于大數據方向點線面的可視化效果展示。目前支持散點圍欄熱力網格聚合等方式致力于讓大數據可視化變得簡單易用。后續(xù)會輸出創(chuàng)造更好的可視化圖形和算法，并后續(xù)推出版本。
本文作者：TalkingData 可視化工程師 李鳳祿
inMap 是 TalkingData 可視化團隊開源的一款基于 canvas 的大數據可視化庫，專注于大數據方向點、線、面的可視化效果展示。目前支持散點、圍欄、熱力、網格、聚合等方式；致力于讓大數據可視化變得簡單易用。
GitHub地址：https://github.com/TalkingData/inmap (求Star！)
文檔地址：http://inmap.talkingdata.com
特性：多線程 高性能
多圖層疊加
智能的算法
友好的 API
可以自定義主題
效果截圖如下：inMap 是更加智能的地理可視化框架，主要面向從事數據可視化應用相關的工程師和設計師。
底層繪圖引擎：目前基于 canvas 2d 提供基礎繪圖能力，基于 WebGL 的版本正在規(guī)劃中；
算法：內置了經緯度墨卡托轉換、文字避讓算法、最佳標記點算法、自動分組標記配色算法等。
inMap 寫的每個算法都是為了增強用戶體驗，追求極致效果，我們希望用 inMap 能夠做出偉大的產品。
inMap 接口設計也很友好，希望讓開發(fā)者通過簡單的配置，就能快速構建出優(yōu)美可視化效果。
文字避讓算法介紹：我們在項目中經常會遇到在地圖上打點并標上文字的需求，我們用某流行的可視化庫展示出效果如下：
（文字密密麻麻一團，都疊在一塊，效果很差，估計會被要被產品經理咬住不放）
inMap 實現了基于文字排版算法，是不是很贊，效果圖如下：
是不是很酷啊，inMap 實現了自己的四分位文字排版算法，聽起來不明覺厲的樣子，別著急，讓我慢慢道來。
每一個標記點都有上下左右四個放文字的位子，如果左邊放不下，那就放右邊試試，還不行就放到下面試試，以此類推，原理就這么簡單，哈哈。
實現細節(jié)如下：
求出要顯示文字的矩形（文字寬高）
創(chuàng)建帶有坐標的虛擬文字集合對象、對集合的坐標進行從小到大排序
遞歸遍歷虛擬文字集合、判斷是否與其他相交，如果有相交就移動當前文字位子，直到不相交為止。當找不到合適位置時，就選擇隱藏當前文字。
后續(xù)會輸出創(chuàng)造更好的可視化圖形和算法，并后續(xù)推出 WebGL 版本。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規(guī)行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://systransis.cn/yun/92238.html
摘要：在許多志愿者的幫助下，將文檔全部翻譯為英文，在開發(fā)者社區(qū)頗受歡迎。有了英文版后，更多的國外開發(fā)者也參與到討論之中，相信接下來會有更多來自國外的。英文版的翻譯離不開社區(qū)的貢獻，在此特別感謝和三位熱心志愿者。 showImg(https://segmentfault.com/img/bVRG13?w=2880&h=1800); 兩年前，我開始接觸 Vue.js 框架，當時就被它的輕量、組件...
摘要：在許多志愿者的幫助下，將文檔全部翻譯為英文，在開發(fā)者社區(qū)頗受歡迎。有了英文版后，更多的國外開發(fā)者也參與到討論之中，相信接下來會有更多來自國外的。英文版的翻譯離不開社區(qū)的貢獻，在此特別感謝和三位熱心志愿者。 showImg(https://segmentfault.com/img/bVRG13?w=2880&h=1800); 兩年前，我開始接觸 Vue.js 框架，當時就被它的輕量、組件...
摘要：避讓算法采用的是四分位模型算法，接下來手把手教你寫避讓算法，老司機帶你裝逼帶你飛。創(chuàng)建四分位模型所謂四分位模型，每一個標記點都有上下左右四個放文字的位子，如果左邊放不下，那就放右邊試試，還不行就放到下面試試，以此類推，原理就這么簡單，哈哈。 本文作者：TalkingData 可視化工程師李鳳祿編輯：Aresn inMap 是一款基于 canvas 的大數據可視化庫，專注于大數據方向點線...
摘要：目前支持散點圍欄熱力網格聚合等方式致力于讓大數據可視化變得簡單易用。如圖表示，紅色區(qū)域表示分析要素的密度大，而藍色區(qū)域表示分析要素的密度小。實現熱力原理讀取每個像素的值透明度，做一個顏色映射。 本文作者：TalkingData 可視化工程師李鳳祿編輯：Aresn 歡迎加入 QQ 群參與技術討論：618308202 inMap 是一款基于 canvas 的大數據可視化庫，專注于大數據方...
閱讀 2114·2021-11-11 16:55
閱讀 3183·2021-10-11 10:58
閱讀 3061·2021-09-13 10:28
閱讀 3997·2021-07-26 23:57
閱讀 1044·2019-08-30 15:56
閱讀 1341·2019-08-29 13:15
閱讀 1278·2019-08-26 18:18
閱讀 1284·2019-08-26 13:44
