用於React應用程序的數據可視化組件

用於React應用程序的數據可視化組件

作者Niilo Keinänen

 

React2021年網絡上最流行的前端開發框架之一。它是一個免費和開源的前端JS庫,用於爲單頁應用程序(SPA)構建交互式用戶界面。

 

(它的受歡迎程度不斷上升,因爲HTMLJavaScript有基本瞭解的用戶都可以使用)

 

 

 

 

 

但不僅如此React的數據可視化因其獨特的功能(如虛擬DOM和JJSX)而變得高效。對大量的數據進行可視化可能是一項繁瑣的任務!

 

 

 

除此之外,與數據集打交道也是很耗時和令人沮喪的。與所有流行的JavaScript前端框架(如React、Angular和Vue)兼容的圖表解決方案可以使工作變得更容易和更快。

 

 

 

出於這個原因,我們的LightningChart團隊維護LightningChart JS <-> React項目模板已經有很長一段時間了。

 

 

 

在過去的幾年裏,我們一直在各種開發者論壇上留意,似乎很多人還沒有意識到React中高性能數據可視化的現代可能性! 

 

 

 

因此,我們決定創建一個小的示例庫,展示一個簡單的用戶界面,裏面有一個嵌入式的熱圖圖表。

 

 

 

有趣的是,你可以在這裏看到這個應用的運行情況,就在這篇文章中嵌入了這個應用!

 

 

 

獲取React數據可視化模板

 

默認情況下,這個熱力圖圖表有100萬個數據點--然而,正如你所看到的,加載是即時的。

 

此外,我們LightningChart最近主持了一個不同熱圖圖表供應商和開源工具的公開性能比較。結果連我們自己都感到驚訝--我們的熱圖圖表比一般的JS圖表庫(是的,商業的和開源的)要高效1000倍以上。

 

另外,這個React應用程序的用戶界面允許你通過修改行和列的數量來探索不同的熱圖大小。所以,去看看你能做到什麼程度(然而,如果你超過5000萬個數據點左右,你的瀏覽器有可能會耗盡內存而崩潰,它也可能需要一段時間來生成隨機測試數據)。

 

你可以在我們的GitHub資源庫中找到這個應用程序的源代碼,這可以成爲在React應用程序中嵌入圖表的一個很好的開端

 

爲什麼要將LightningChart嵌入到你的應用程序中?

 

 

以下是一些你可能想嘗試將LightningCharts嵌入到你的應用程序中的原因:

 

  • 我們已經設計了我們的圖表,使其在執行時對網站的壓力最小,同時支持以前沒有見過的數據可視化應用,如具有數百個高分辨率(1 kHz或更高)數據源的實時圖表。
  • 我們支持網絡圖表中最流行的圖表類型和數據可視化功能。
  • 它是免費的! 對每個嘗試我們的圖表或將其用於非商業應用的人,我們提供完全免費的社區許可,不需要證書,不需要註冊,也不需要安裝許可軟件
  • 最後但同樣重要的是,它很容易! 我們目前有12個數據可視化框架開發模板,用於啓動你在不同框架和平臺上的開發,涵蓋了各種需求,如瀏覽器數據可視化、服務器端渲染和跨平臺的桌面應用
  • 您可以輕鬆地將我們的圖表插入到您現有的或新的用戶界面中。
  • 在靜態和實時數據源中流淌着數百萬甚至數十億的數據點。

 

瞭解更多關於LightningCharts JS 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章