原創(chuàng)|使用教程|編輯:郝浩|2013-09-06 14:25:25.000|閱讀 1629 次
概述:使用FusionCharts的時(shí)候,用戶可以通過(guò)設(shè)置簡(jiǎn)單的JavaScript代碼,用于更改圖表上的數(shù)據(jù)。先創(chuàng)建一個(gè)簡(jiǎn)單的圖表,然后改變它的數(shù)據(jù)(請(qǐng)參見下面的代碼)。
# 界面/圖表報(bào)表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關(guān)鏈接:
在使用FusionCharts的時(shí)候,用戶可以先創(chuàng)建一個(gè)簡(jiǎn)單的圖表,然后改變它的數(shù)據(jù)(請(qǐng)參見下面的代碼)。圖表最初據(jù)顯示8月份的銷售數(shù)據(jù),當(dāng)用戶點(diǎn)擊按鈕時(shí)改為顯示9月份的銷售數(shù)據(jù)。每個(gè)月都有單獨(dú)的XML文件,代碼如下:
<html> <head> <title>Update Chart data</title> <script type="text/javascript" src="../../FusionCharts/FusionCharts.js"> </script> </head> <body> <div id="chartContainer">FusionCharts will load here!</div> <script type="text/javascript"> <!-- var myChart = new FusionCharts( "../../FusionCharts/Column3D.swf", "myChartId", "400", "300", "0", "1" ); myChart.setXMLUrl("AugustData.xml"); myChart.render("chartContainer"); function changeMonth() { var chartReference = FusionCharts("myChartId"); chartReference.setXMLUrl("SeptemberData.xml"); } // --> </script> <input type="button" onClick="changeMonth();" value="Change Month"> </body> </html>
在上面的代碼中,我們使用8月的數(shù)據(jù)創(chuàng)建了一個(gè)圖表,數(shù)據(jù)存在于AugustData.xml文件中。然后創(chuàng)建了一個(gè)HTML按鈕,用于調(diào)用一個(gè)JavaScript函數(shù)chageMonth()。 在這個(gè)函數(shù)有:
最終圖表如下所示:
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請(qǐng)務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請(qǐng)郵件反饋至chenjj@fc6vip.cn
文章轉(zhuǎn)載自:慧都控件網(wǎng)