大陆性a及毛片,日韩精品不卡,国产精品第四页,日韩黄在线观看,欧美三级一区二区,国产中出在线观看,日韩久久久精品

    電話

    0411-39943997

仟億科技
客服中心
  • 電話
  • 電話咨詢：0411-39943997
  • 手機(jī)
  • 手機(jī)咨詢:15840979770
    手機(jī)咨詢:13889672791
網(wǎng)絡(luò)營(yíng)銷(xiāo) >更多
您現(xiàn)在的位置：首頁(yè) > 新聞中心 > 常見(jiàn)問(wèn)題

基于谷歌圖表API的jquery組件詳解

作者：billionnet 發(fā)布于:2012/3/19 18:13:18 點(diǎn)擊量：

gchart：基于谷歌google圖表API的jquery組件全攻略——入門(mén)


gchart是基于谷歌google圖表API的jquery組件。使用gchart可以方便地生成強(qiáng)大的各種圖表和報(bào)表?；趃oogle圖表接口的gchart，有著簡(jiǎn)單、方便、強(qiáng)大、夠用、好用的特點(diǎn)。《gchart：基于jquery的google圖表接口組件全攻略》系列文章將帶你走入gchart的報(bào)表世界。


先解釋一下這個(gè)拗口的標(biāo)題


谷歌google圖表API：


谷歌google圖表API是谷歌google提供的一個(gè)可以生成各種圖表的api接口。根據(jù)各種您的需求，Google 圖表 API 會(huì)返回一幅 PNG 格式的圖片來(lái)響應(yīng)一個(gè)網(wǎng)址。Google 圖表 API 可以生成多種類(lèi)型的圖片，包括折線圖、條形圖和餅圖。您可以為每種圖片類(lèi)型指定屬性，例如大小、顏色和標(biāo)簽。


上面是抄Google圖表API官方網(wǎng)站的，按照符合中國(guó)人聽(tīng)力習(xí)慣的話說(shuō)就是：google圖表API是一特屌的接口，把你想要的報(bào)表需求往里面一塞，他就能給你一PNG圖片，這個(gè)PNG圖片就是你想要的報(bào)表！


基于jquery的XX組件：


說(shuō)白了就是：一哥們，寫(xiě)了一個(gè)JavaScript組件，但是這哥們有點(diǎn)懶，他不想得到一個(gè)元素還要document.getElementById，于是就使用了一個(gè)JavaScript基礎(chǔ)庫(kù)——jquery。他就不用費(fèi)心費(fèi)力的去解決那些什么瀏覽器兼容性等亂七八糟的JavaScript問(wèn)題，而把主要精力放在他要實(shí)現(xiàn)的組件邏輯上了。當(dāng)然，使用jquery還有其他的一大把好處?？傊?，你要想使用這哥們的JavaScript組件，那就的先引入jquery這個(gè)JavaScript基礎(chǔ)庫(kù)。


gchart：


上面說(shuō)到，一個(gè)哥們想寫(xiě)一個(gè)JavaScript組件，而這個(gè)組件的功能就是為了更簡(jiǎn)單、方便的調(diào)用google的圖表API，來(lái)生成各種圖表。


總之 gchart 這個(gè)玩意，前面用的是別人jquery的，后面用的是別人google圖表API的。不過(guò)，你也別小看它，能劃繁雜為簡(jiǎn)單、劃腐朽為神奇，也算是一人才。而咱的這個(gè)《gchart：基于jquery的google圖表接口組件全攻略》系列文章，就是解讀它的。



先看看gchart能做什么


下面是一些圖片，來(lái)說(shuō)明gchart可以做什么：



gchart生成的折線圖



gchart生成的柱狀圖



gchart生成的2D餅圖



gchart生成的3D餅圖



gchart生成的雷達(dá)



gchart生成的地圖圖表


gchart還可以生成一些看上去亂七八糟的，貌似普通情況下用不到的圖表：



gchart生成的散布圖



gchart生成的維恩圖



gchart生成的速度儀表盤(pán)圖



gchart生成的二維條形碼


恩，反正你能想到的圖表，基本上使用gchart都可以生成。恩～說(shuō)是gchart生成的似乎不太恰當(dāng)，準(zhǔn)確的說(shuō)，應(yīng)該是：使用gchart操作google圖表API生成。其實(shí)最終還是人家google圖表API生成的。



使用gchart的前期準(zhǔn)備：


通過(guò)這拗口的標(biāo)題，我們就能大致的了解使用gchart需要的東西。




  • google圖表API。這個(gè)完全不用擔(dān)心。這個(gè)已經(jīng)被gchart搞定了。它會(huì)自動(dòng)鏈接google的圖表api服務(wù)器調(diào)用。所以，我們不用做任何事情。當(dāng)然，要保證你使用gchart的電腦能上網(wǎng)才行。


  • jquery.js。這個(gè)不用說(shuō)了吧。滿大街都是，隨便找個(gè)過(guò)來(lái)就可以了。1.2.3版本以上即可。


  • gchart腳本庫(kù)。不用擔(dān)心，我這就提供下載：jquery.gchart.js(51k,這個(gè)是沒(méi)有經(jīng)過(guò)壓縮和加密的)，jquery.gchart.pack.js(14k,這個(gè)是經(jīng)過(guò)壓縮打包的)。

好，讓我們做一個(gè)小例子吧


正如你看到的，gchart看上去是個(gè)龐大的東西，這也是為什么，我寫(xiě)的是個(gè)系列文章，而不是一篇文章的原因。當(dāng)文章過(guò)長(zhǎng)的時(shí)候，大家會(huì)很不喜歡閱讀，所以，本篇，只列一個(gè)小的例子，也不會(huì)做過(guò)多的解釋，更詳細(xì)的解釋，會(huì)放在下一篇文章中進(jìn)行。


運(yùn)行代碼框

[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]


本示例網(wǎng)址：
http://downloads.cnblogs.com/justinyoung/gchart/articleExample001.html
打包下載地址如下：gchart示例001


生成的圖表見(jiàn)下圖：



一個(gè)簡(jiǎn)單的gchart示例


本篇僅僅是個(gè)引子，詳細(xì)的解釋和說(shuō)明，將在下篇文章中繼續(xù)，敬請(qǐng)期待哦。


 



分享到：

Copyright@ 2011-2016 版權(quán)所有：大連千億科技有限公司 遼ICP備11013762-3號(hào)   google網(wǎng)站地圖   百度網(wǎng)站地圖   網(wǎng)站地圖

公司地址：大連市沙河口區(qū)中山路692號(hào)辰熙星海國(guó)際2317 客服電話：0411-39943997 QQ：2088827823 37482752

法律聲明：未經(jīng)許可，任何模仿本站模板、轉(zhuǎn)載本站內(nèi)容等行為者，本站保留追究其法律責(zé)任的權(quán)利！ 隱私權(quán)政策聲明