融合圖表，從閃存到純JavaScript

已經實現了融合圖表中的Flash格式。是否有可能將其轉換爲純JavaScript形式？如果是的話，可以請你詳細說明如何做到這一點，即在哪個地方變化作出。融合圖表，從閃存到純JavaScript

2013-10-22 xtras

如果您使用的是最新版本的FusionCharts（3.3.0及以上版本），只需將../Column3D.swf替換爲Column3D就可以了！確保你在同一個文件夾中有FusionCharts.HC.js和FusionCharts.HC.Charts.js爲FusionCharts.js。您的代碼看起來像......

<html> 
    <head>   
    <title>My First chart using FusionCharts XT - Using pure JavaScript</title>   
    <script type="text/javascript" src="../FusionCharts.js"></script> 
    </head> 
    <body>  
    <div id="chartContainer">FusionCharts XT will load here!</div>   
    <script type="text/javascript"> 
     var myChart = new FusionCharts("Column3D", "myChartId", "400", "300"); 
     myChart.setXMLUrl("Data.xml"); 
     myChart.render("chartContainer"); 
    </script>  
    </body> 
</html>

不過，我也建議一個更可讀的代碼，如...

<html> 
    <head>   
    <title>My First chart using FusionCharts XT - Using pure JavaScript</title>   
    <script type="text/javascript" src="../FusionCharts.js"></script> 
    <script type="text/javascript"> 
     FusionCharts.addEventListener("ready", function() { 
      var myChart = new FusionCharts({ 
       type: "column3d", 
       id: "myChartId", 
       width: "400", 
       height: "300", 
       renderAt: "chartContainer", 
       dataSource: "Data.xml", 
       dataFormat: "xmlurl" 
      }).render(); 
     }); 
    </script>  
    </head> 
    <body>  
    <div id="chartContainer">FusionCharts XT will load here!</div>   
    </body> 
</html>

來源

2013-10-22 10:54:22

真:)對我來說，這是MSLine。謝謝。 – xtras

請確認您是否已經在使用FusionCharts XT，現在如果您只想渲染JavaScript圖表，無論是否安裝Flash Player，只需將以下單行代碼添加到現有實現中。

FusionCharts.setCurrentRenderer('javascript');

該代碼會問FusionCharts的渲染器跳過的Flash渲染和營造純JavaScript圖表。

最終的HTML代碼如下所示：

<html> 
    <head>   
    <title>My First chart using FusionCharts XT - Using pure JavaScript</title>   
    <script type="text/javascript" src="../FusionCharts.js"></script> 
    </head> 
    <body>  
    <div id="chartContainer">FusionCharts XT will load here!</div>   
    <script type="text/javascript"> 
     FusionCharts.setCurrentRenderer('javascript'); 
     var myChart = new FusionCharts("../Column3D.swf", "myChartId", "400", "300", "0", "1"); 
     myChart.setXMLUrl("Data.xml"); 
     myChart.render("chartContainer"); 
    </script>  
    </body> 
</html>

此外，渲染JavaScript的圖表，FusionCharts的XT利用「FusionCharts.HC.js」，「FusionCharts.HC.Charts.js」的和「jquery.min.js」。這些文件出現在下載包的「圖表」文件夾中。

你並不需要在HTML顯式地加載這些文件，但將其放在同一個文件夾「FusionCharts.js」。「FusionCharts.js」自動處理加載。

有關純JavaScript圖表渲染的細節在此link中被詳細地提及。

來源

2013-10-22 10:24:57

其實不希望任何SWF文件是在我的項目。幸運的是，它包含了FusionCharts.HC.js和其他必需的文件。感謝您的回覆。 – xtras

融合圖表，從閃存到純JavaScript

回答

相關問題