Highcharts是一個(gè)制作圖表的純Javascript類庫。Highcharts能夠兼容當(dāng)今所有的瀏覽器,包括IE、火狐、蘋果等。用戶可以使用該軟件制作直線圖,曲線圖、區(qū)域圖、區(qū)域曲線圖、柱狀圖、餅狀圖、散布圖等大部分類型的圖表。
軟件特色
1、兼容性:兼容當(dāng)今所有的瀏覽器,包括iPhone、IE和火狐等等。
2、對(duì)個(gè)人用戶完全免費(fèi)。
3、純JS,無BS。
4、支持大部分的圖表類型:直線圖,曲線圖、區(qū)域圖、區(qū)域曲線圖、柱狀圖、餅狀圖、散布圖。
5、跨語言:不管是PHP、Asp.net還是Java都可以使用,它只需要三個(gè)文件:一個(gè)是Highcharts的核心文件highcharts.js,還有a canvas emulator for IE和Jquery類庫或者M(jìn)ooTools類庫。
6、提示功能:鼠標(biāo)移動(dòng)到圖表的某一點(diǎn)上有提示信息。
7、放大功能:選中圖表部分放大,近距離觀察圖表。
8、易用性:無需要特殊的開發(fā)技能,只需要設(shè)置一下選項(xiàng)就可以制作適合自己的圖表。
9、時(shí)間軸:可以精確到毫秒。
安裝說明
安裝編號(hào)
npm和Bower
Highcharts也可以通過npm和Bower打包獲得。分別閱讀有關(guān)使用npm或Bower進(jìn)行安裝的更多信息。如果您不使用這些,請(qǐng)繼續(xù)閱讀。
1、包括Highcharts
《head》如下所示,將Javascript文件包含在網(wǎng)頁的部分中。
《腳本src = “ https://code.highcharts.com/highcharts.js ” 》 《/腳本》
如果需要對(duì)IE6、7或8的支持,則需要包括一些polyfill。請(qǐng)參閱系統(tǒng)要求中的詳細(xì)信息。
2、或者,從您自己的域中加載文件
在上面的示例中,Javascript文件是從ajax.googleapis.com和code.highcharts.com加載的??梢詮膆ighcharts.com下載Highcharts文件,并將其放在您的網(wǎng)頁上。這是從您自己的服務(wù)器提供的Highcharts的示例:
《腳本src = “ /js/highcharts.js ” 》 《/腳本》
3、加載Highcharts庫存或Highcharts地圖
Highcharts庫存中已包含Highcharts,因此不必同時(shí)加載兩者。軟件包中包含highstock.js文件。還包含了highmaps.js文件,但與highstock.js不同,該文件不包含完整的Highcharts功能集??梢詫ighcharts Stock和Highcharts地圖加載為單獨(dú)的文件,如下所示:
《腳本src = “ /js/highstock.js ” 》 《/腳本》
《腳本src = “ /js/highmaps.js ” 》 《/腳本》
但是,單獨(dú)的文件不能一起或與highcharts.js一起在同一頁面中運(yùn)行。因此,如果需要在彼此相同的頁面或帶有基本Highcharts的頁面中使用庫存或地圖,則可以將它們作為模塊加載:
《腳本src = “ /js/highcharts.js ” 》 《/腳本》
《腳本src = “ /js/modules/stock.js ” 》 《/腳本》
《腳本src = “ /js/modules/map.js ” 》 《/腳本》
4、開始使用
您現(xiàn)在可以使用Highcharts了,請(qǐng)參閱第一個(gè)圖表以開始使用。
Highcharts版本1.x依靠excanvas.js在IE中呈現(xiàn)。從Highcharts 2.0(和所有Highcharts Stock版本)開始,IE VML渲染內(nèi)置到庫中。
常見問題
Highcharts是否引用我們域外的文件?
對(duì)于基本用法,Highcharts除了highcharts.js / highstock.js之外,不引用任何其他文件,盡管您需要注意某些情況。
導(dǎo)出模塊。由于并非所有瀏覽器都能夠?qū)D表轉(zhuǎn)換為圖像格式,因此默認(rèn)情況下,此操作是在我們的Web服務(wù)https://export.highcharts.com上完成的。生成的SVG從瀏覽器發(fā)送到導(dǎo)出服務(wù)器,然后將圖像發(fā)送回去。如果您擔(dān)心數(shù)據(jù)內(nèi)容通過Internet傳輸,則應(yīng)考慮我們的替代解決方案。最簡單的選擇是使用我們的 模塊進(jìn)行客戶端導(dǎo)出。查看功能和兼容性表是否符合您的要求。如果您有權(quán)訪問節(jié)點(diǎn)服務(wù)器,則還可以設(shè)置自己的導(dǎo)出服務(wù)器。
某些功能(包括客戶端導(dǎo)出)可能需要第三方依賴性。其中一些是根據(jù)需要從我們的服務(wù)器加載的,但是在這些情況下,加載位置是可配置的。有關(guān)所有外部依賴項(xiàng)的詳細(xì)信息,包括許可和安全性詳細(xì)信息,可以在可選的依賴項(xiàng) 文檔文章中找到。
我的圖表無法在Internet Explorer 7或8展示?
圖表在現(xiàn)代瀏覽器中有效但在IE6、7和8中失敗的最常見原因是配置選項(xiàng)中的逗號(hào)逗號(hào)。流浪逗號(hào)是Javascript中對(duì)象或數(shù)組的最后一項(xiàng)之后的逗號(hào)。這些將在現(xiàn)代瀏覽器中靜默傳遞,但會(huì)在舊版IE中導(dǎo)致Javascript錯(cuò)誤。