非常漂亮的免費(fèi)純JavaScript圖表庫(kù)

Highcharts 是一個(gè)用純JavaScript編寫(xiě)的一個(gè)圖表庫(kù), 能夠很簡(jiǎn)單便捷的在web網(wǎng)站或是web應(yīng)用程序添加有交互性的圖表，并且免費(fèi)提供給個(gè)人學(xué)習(xí)、個(gè)人網(wǎng)站和非商業(yè)用途使用。目前HighCharts支持的圖表類(lèi)型有曲線(xiàn)圖、區(qū)域圖、柱狀圖、餅狀圖、散狀點(diǎn)圖和綜合圖表。

HighCharts界面美觀(guān)，由于使用JavaScript編寫(xiě)，所以不需要像Flash和Java那樣需要插件才可以運(yùn)行，而且運(yùn)行速度快。另外HighCharts還有很好的兼容性，能夠完美支持當(dāng)前大多數(shù)瀏覽器。現(xiàn)在官方的最新版本為HighCharts2.3.5。

特點(diǎn)

具有良好的兼容性：它可以在所有現(xiàn)代瀏覽器中很好地工作，包括iPhone，iPad甚至Internet Explorer 6。標(biāo)準(zhǔn)的瀏覽器使用SVG進(jìn)行圖形繪制，而在傳統(tǒng)的Internet Explorer則使用VML進(jìn)行繪制。

對(duì)非商業(yè)用戶(hù)完全免費(fèi)：無(wú)論你想要在個(gè)人網(wǎng)站，學(xué)校網(wǎng)站或是任何一個(gè)非營(yíng)利組織中使用Highcharts，你都不需要經(jīng)過(guò)授權(quán)。

開(kāi)源：無(wú)論你使用的是Highcharts的免費(fèi)版本還是商業(yè)授權(quán)版本，你都可以下載它的源代碼并作出自己的修改，這給予了用戶(hù)極大的自由度。

純粹的JavaScript：Highcharts是完全基于本地瀏覽器技術(shù)的，不需要像Flash或Java那樣依賴(lài)于客戶(hù)端插件。此外，你不需要在服務(wù)器上安裝任何東西，包括PHP或ASP.NET。Highcharts只需要兩個(gè)核心文件：highcharts.js核心文件和jQuery，MooTools或Prototype框架的其中之一，而這個(gè)框架可能已經(jīng)早就在你的網(wǎng)頁(yè)中使用了。

眾多的圖表類(lèi)型：Highcharts支持直線(xiàn)圖，曲線(xiàn)圖、區(qū)域圖、區(qū)域曲線(xiàn)圖、柱狀圖、餅裝圖、散布圖等常見(jiàn)的圖表類(lèi)型，并且能夠?qū)⑺麄兘Y(jié)合在一個(gè)圖表里。

簡(jiǎn)單的配置語(yǔ)法：配置Highcharts不需要任何的編程技術(shù)，它的配置變量只需要一個(gè)簡(jiǎn)單的JavaScript對(duì)象。

動(dòng)態(tài)：在創(chuàng)建圖表后的任何時(shí)候，你都可以通過(guò)一個(gè)完整的API對(duì)系列和數(shù)據(jù)點(diǎn)進(jìn)行添加，刪除和修改，也對(duì)坐標(biāo)軸進(jìn)行修改。許多事件都提供了為圖表進(jìn)行編程的鉤子，結(jié)合jQuery，MooTools或Prototype框架的AJAX API，它甚至提供了能夠?qū)崟r(shí)動(dòng)態(tài)地顯示服務(wù)器數(shù)據(jù)的解決方案。

多軸：有時(shí)候你需要比較不同度量的數(shù)據(jù)，比如溫度，降雨量和空氣壓力，Highcharts可以讓你為每個(gè)數(shù)據(jù)集設(shè)置不同的Y軸，而如果你想要比較不同類(lèi)別的數(shù)據(jù)，也可以設(shè)置不同的X軸。每個(gè)軸都可以放置在圖表上下左右的任何位置，所有選項(xiàng)都可以單獨(dú)設(shè)置，包括翻轉(zhuǎn)，風(fēng)格和位置。

提示標(biāo)簽：當(dāng)鼠標(biāo)停在圖表的任何一個(gè)點(diǎn)或一個(gè)系列，都可以顯示一個(gè)包含相關(guān)信息的工具條提示，而當(dāng)鼠標(biāo)在圖表上移動(dòng)時(shí)，它會(huì)自動(dòng)選擇離鼠標(biāo)最近的點(diǎn)來(lái)進(jìn)行顯示，這對(duì)查看圖表數(shù)據(jù)提供了極大的便利。

時(shí)間軸：75%的圖表都帶有一個(gè)時(shí)間軸作為X軸，Highcharts非常智能，甚至可以精確到毫秒，它也可以標(biāo)志出一個(gè)月的開(kāi)始或一周的開(kāi)始，乃至午夜和正午等等。

導(dǎo)出和打印：如果啟用了導(dǎo)出模塊，您的用戶(hù)可以通過(guò)點(diǎn)擊導(dǎo)出按鈕將圖表導(dǎo)出為PNG, JPG, PDF或SVG格式，也可以直接將其打印出來(lái)。

縮放：你可以通過(guò)縮放來(lái)更仔細(xì)地查看你對(duì)圖表中感興趣的部分，縮放可以作用在X軸或Y軸上，也可以同時(shí)作用在兩個(gè)軸上。

外部數(shù)據(jù)加載：Highcharts的數(shù)據(jù)來(lái)自于一個(gè)JavaScript數(shù)組，因此數(shù)據(jù)可以定義在一個(gè)本地配置對(duì)象中，也可以定義在一個(gè)單獨(dú)的文件中，甚至可以來(lái)自不同的網(wǎng)站。此外，數(shù)據(jù)可以以任何形式傳遞給Highcharts，只需一個(gè)將數(shù)據(jù)解析為數(shù)組的回調(diào)函數(shù)。

角度計(jì)：針對(duì)儀表盤(pán)和角度計(jì)等，Highcharts提供了一種類(lèi)似速度計(jì)的圖表，讓你可以一目了然地查看數(shù)據(jù)。

極坐標(biāo)圖表：笛卡爾坐標(biāo)系的圖表可以很簡(jiǎn)單的選項(xiàng)來(lái)轉(zhuǎn)換成極坐標(biāo)系圖表或徑向圖。

倒轉(zhuǎn)或翻轉(zhuǎn)圖表：有時(shí)候你需要將圖表翻轉(zhuǎn)，使X軸垂直，這也是支持的。

旋轉(zhuǎn)標(biāo)簽：所有的文本標(biāo)簽，包括軸標(biāo)簽，數(shù)據(jù)點(diǎn)標(biāo)簽和坐標(biāo)軸標(biāo)題標(biāo)簽，都可以進(jìn)行任意角度的旋轉(zhuǎn)。

調(diào)用方式

var chart = new Highcharts.Chart({

chart: {…}

colors: [{…}]

credits: {…}

exporting: {…}

global: {…}

labels: {…}

lang: {…}

legend: {…}

loading: {…}

navigation: {…}

pane: {…}

plotOptions: {…}

series: [{…}]

subtitle: {…}

title: {…}

tooltip: {…}

xAxis: {…}

yAxis: {…}

});

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com