ichartjs怎么用

這篇文章給大家分享的是有關(guān)ichartjs怎么用的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

　　ichartjs是一款基于html5的圖形庫。使用純JavaScript語言,利用html5的canvas標(biāo)簽繪制各式圖形。ichartjs致力于為您的應(yīng)用提供簡單、直觀、可交互的體驗(yàn)級圖表組件。是WEB/APP圖表展示方面的解決方案。如果你正在開發(fā)html5的應(yīng)用，ichartjs正好適合您。ichartjs目前支持餅圖、環(huán)形圖、折線圖、面積圖、柱形圖、條形圖。ichartjs是基于ApacheLicense2.0協(xié)議的開源項(xiàng)目。

　　ichartjs基于HTML5圖形圖表組件

　　1.構(gòu)建項(xiàng)目環(huán)境

　　由于ichartjs是一個js庫，所以只要將ichart.js加入你頁面的head中就完成了ichartjs的運(yùn)行環(huán)境。代碼如下：

　　<scripttype="text/javascript"src="ichart.1.2.min.js"></script>

　　2.例子說明

　　我們利用2D柱形圖來展示HelloWorld的各個字母在字母表中的位置的情況。我們將位置抽象為其高度。來以我們的方式來展示一個不一樣的HelloWorld。

　　3.預(yù)覽

　　我們先來看下例子最后的預(yù)覽圖，以便使你讀起來沒有那么乏味。如下圖：

　　ichartjsHTML5圖形圖表組件代碼說明

　　 //定義數(shù)據(jù)

　　 vardata=[

　　  {name:'H',value:7,color:'#a5c2d5'},

　　  {name:'E',value:5,color:'#cbab4f'},

　　  {name:'L',value:12,color:'#76a871'},

　　  {name:'L',value:12,color:'#76a871'},

　　  {name:'O',value:15,color:'#a56f8f'},

　　  {name:'W',value:13,color:'#c12c44'},

　　  {name:'O',value:15,color:'#a56f8f'},

　　  {name:'R',value:18,color:'#9f7961'},

　　  {name:'L',value:12,color:'#76a871'},

　　  {name:'D',value:4,color:'#6f83a5'}

　　 ];

感謝各位的閱讀！關(guān)于“ichartjs怎么用”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！