asp.net中繪制大數據量的可交互的圖表


  在一個asp.net項目中要用到能繪制大數據量信息的圖表,並且是可交互的(放大、縮小、導出、打印、實時數據),能夠繪制多種圖形。

  為此進行了多方調查預研工作,預研過微軟的MsChart圖表組件、基於jquery的FlortChart圖表、Silverlight的Visifire圖表組件、基於js和flash的FusionCharts圖表、Ext4.0框架中的圖表、純js的Highstock和純js的Highcharts。

下面給出各個圖表的預研結果,以供參考。

 

 

MsChart

MsChart是一個微軟自帶圖表,圖表支持事件、實時數據、導出圖片、打印圖表等功能,但是不支持放大縮小功能。所表現的形式是圖片

數據量

6M

數據格式

支持DataTable、Object[]等多種數據形式

交互方式

通過.cs后台代碼進行數據填充

數據源時間

16s

響應時間

毫秒

優點

對大數據量支持效果比較好,響應時間快,不需要用戶下載安裝任何插件

缺點

不支持放大縮小功能,表現形式是圖片,不滿足系統需求

 

Highcharts

Highcharts是一款純js的圖表,圖表支持事件、實時數據、放大縮小、導出圖片、打印圖表功能

數據量

6M

數據格式

Json輕數據格式

交互方式

Highcharts通過ajax調用后台方法獲取數據,然后顯示;

數據源時間

16.97s

響應時間

8s

優點

易於維護和定制、展現美觀、滿足系統需求,不需要用戶下載安裝任何插件

缺點

加載速度慢,容易造成瀏覽器卡死

 

FlortChart

FlortChart基於JQuery的圖形組件,支持事件、放大縮小

 

數據量

6M

數據格式

Xml,json

交互方式

FlortChart通過ajax調用后台方法獲取數據,然后顯示

數據源時間

16s

響應時間

40s

優點

開源免費,不需要用戶下載安裝任何插件

缺點

加載速度慢,容易造成瀏覽器卡死

 

Visifire

Visifire是基於微軟Silverlight的一個圖形組件,支持事件、放大縮小

數據量

6M

數據格式

Xaml

交互方式

Visifire通過ajax調用后台方法獲取數據,然后顯示

數據源時間

16s

響應時間

2~3s

優點

數據加載后響應比較快

缺點

不易定制,無法實現實時數據,用戶要下載安裝Silverlight組件

 

FusionCharts

FusionCharts基於Js和Flash的圖形組件,支持事件、放大縮小

數據量

6M

數據格式

XML 、JSON

交互方式

FusionCharts通過ajax調用后台方法獲取數據,然后顯示

數據源時間

16s

響應時間

1~2s

優點

有固定的模版,響應速度快,交互流暢

缺點

收費,用戶要下載安裝Flash組件

 

Ext4.0

Ext4.0中自帶的圖表控件是基於Flash,支持事件、實時數據、提示框

數據量

6M

數據格式

Xml,json

交互方式

Ext圖表通過ajax調用后台方法獲取數據,然后顯示

數據源時間

16s

響應時間

10s

優點

框架體系中自帶,融合度高;不需要用戶下載安裝任何插件

缺點

加載速度慢,沒找到放大縮小的解決方案

 

Highstock

Highstock是一款純js的圖表,圖表支持事件、實時數據、放大縮小、導出圖片、打印圖表功能

數據量

6M

數據格式

Json輕數據格式

交互方式

Highstock通過ajax調用后台方法獲取數據,然后顯示;

數據源時間

16.97s

響應時間

0~1s

優點

滿足系統需求;

交互響應速度快;

易於維護和定制格式、樣式、界面美觀;

開源免費;

不需要用戶下載安裝任何插件;

缺點

X軸只支持日期

只支持線、柱、面圖表,不支持餅圖、雷達圖等圖表

 

通過結果很容易看出純js的Highstock圖表基本能滿足大數據可交互的需求,接下來我就以Highstock為基點進行大數據量繪制圖形的進行講解。

在進行實際的開發前最好到官網http://www.highcharts.com/ 看一些demos和api(要看Highstock的),這樣有助於詳細了解。

接下來就可以根據demo進行學習了,還可以在源碼中做一些個性化的修改。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM