如何使用JavaScript更新圖表數據

時間 2019-11-13

標籤如何使用 javascript 更新圖表數據欄目 JavaScript 简体版

原文原文鏈接

在使用FusionCharts的時候，用戶能夠先建立一個簡單的圖表,而後改變它的數據(請參見下面的代碼)。圖表最初據顯示8月份的銷售數據,當用戶點擊按鈕時改成顯示9月份的銷售數據。每月都有單獨的XML文件,代碼以下: javascript

<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月的數據建立了一個圖表,數據存在於AugustData.xml文件中。而後建立了一個HTML按鈕,用於調用一個JavaScript函數chageMonth()。在這個函數有: html