jQuery插件FusionWidgets實現(xiàn)的Cylinder圖效果示例【附demo源碼】
本文實例講述了jQuery插件FusionWidgets實現(xiàn)的Cylinder圖效果。分享給大家供大家參考,具體如下:
1、數(shù)據(jù)源
Cylinder.xml:
<?xml version="1.0" encoding="UTF-8"?> <chart palette="4" lowerLimit="0" upperLimit="10000" numberSuffix=" ltrs." bgColor="FF0000" paletteThemeColor="669933" showTickMarks="1" ticksOnRight="0" majorTMNumber="10" minorTMNumber="1" adjustTM="0" tickValueStep="8" cylRadius="500"> <value>8954</value> <value>4512</value> </chart>
2、index.html頁面:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>FusionWidgets Cylinder圖</title> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="FusionCharts/FusionCharts.js"></script> <script type="text/javascript"> $(function(){ var cylinder = new FusionCharts( "FusionCharts/Cylinder.swf", "cylinderId", "100%", "550", "0" ); cylinder.setXMLUrl("Cylinder.xml"); cylinder.render("cylinderDiv"); }); </script> </head> <body> <div id="cylinderDiv"></div> </body> </html>
運行效果圖如下:
附:完整實例代碼點擊此處本站下載。
注:該源碼需要放到服務器環(huán)境下運行!否則無法加載xml文件數(shù)據(jù)。
更多關于jQuery相關內(nèi)容感興趣的讀者可查看本站專題:《jQuery常用插件及用法總結(jié)》、《jquery中Ajax用法總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery擴展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》
希望本文所述對大家jQuery程序設計有所幫助。
- jQuery插件FusionCharts繪制ScrollColumn2D圖效果示例【附demo源碼下載】
- jQuery插件FusionCharts實現(xiàn)的2D面積圖效果示例【附demo源碼下載】
- jQuery插件FusionCharts實現(xiàn)的2D柱狀圖效果示例【附demo源碼下載】
- jQuery插件FusionCharts實現(xiàn)的3D柱狀圖效果實例【附demo源碼下載】
- jQuery插件FusionCharts實現(xiàn)的2D餅狀圖效果【附demo源碼下載】
- jQuery插件FusionCharts繪制的3D餅狀圖效果實例【附demo源碼下載】
- jQuery插件FusionWidgets實現(xiàn)的AngularGauge圖效果示例【附demo源碼】
- jQuery插件FusionWidgets實現(xiàn)的Bulb圖效果示例【附demo源碼下載】
- 12款經(jīng)典的白富美型—jquery圖片輪播插件—前端開發(fā)必備
- 強烈推薦240多個jQuery插件提供下載
- 推薦8款jQuery輕量級樹形Tree插件
- jQuery插件FusionCharts實現(xiàn)的MSBar3D圖效果示例【附demo源碼】
相關文章
JQuery獲取或設置ckeditor的數(shù)據(jù)(示例代碼)
JQuery獲取或設置ckeditor的數(shù)據(jù)(示例代碼)。需要的朋友可以過來參考下,希望對大家有所幫助2013-11-11jquery 簡短幾句代碼實現(xiàn)給元素動態(tài)添加及獲取提示信息
雖然是很基本的東西,但為什么很基本的方法就可以實現(xiàn)的東西有些人偏偏還要去追求復雜高深難懂的呢?這里只是交流而已2011-09-09jquery監(jiān)控數(shù)據(jù)是否變化(修正版)
jquery監(jiān)控數(shù)據(jù)是否變化(修正版) 之前寫的那篇中存在許多bug,今天重新整理了一下。還請各位指教2011-04-04jQuery實現(xiàn)購物車表單自動結(jié)算效果實例
這篇文章主要介紹了jQuery實現(xiàn)購物車表單自動結(jié)算效果,涉及jquery動態(tài)獲取頁面元素及實時改變頁面元素值的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08jquery 將disabled的元素置為enabled的三種方法
在jquery中可以通過jqueryObj.attr("disabled","disabled")將頁面中某個元素置為不可編輯或觸發(fā)狀態(tài),但是在jquery的API reference中并沒說明怎么將頁面置為disable的元素重新置為可觸發(fā)或可編輯的。2009-07-07