日本韩国,99热只有精品在线观看,九九在线精品国产

Flash圖表組件FusionCharts幫助文檔三：在iPhone/iPad中生成JavaScript圖表

原創|其它|編輯：郝浩|2012-11-07 15:04:05.000|閱讀 2542 次

概述：鼎鼎有名的Flash圖表組件 FusionCharts 不再僅僅支持Flash，它還可以在不支持Flash Player 的Web瀏覽器（如iPhone/iPad）上創建純JavaScript 圖表（有時也被稱為HTML5/Canvas圖表）。

# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>

相關鏈接：

鼎鼎有名的Flash圖表組件 FusionCharts 不再僅僅支持Flash，它還可以在不支持Flash Player 的Web瀏覽器（如iPhone/iPad）上創建純JavaScript 圖表（有時也被稱為HTML5/Canvas圖表）。

FusionCharts利用Highcharts庫，最關鍵的是，你無需編寫任何額外的代碼，FusionCharts.js JavaScript類會自動探測不支持Flash的設備，并生成JavaScript圖表。

FusionCharts JavaScript類現在包括四個主要文件：FusionCharts.js, FusionCharts.HC.js, FusionCharts.HC.Charts.js and jquery.min.js。這四個文件放在Download Pack > Charts folder中。你需要把FusionCharts.js放入網頁中，余下的JavaScript文件就會自動根據FusionCharts.js的指令進行加載。

在不支持Flash Player的地方啟動Flash和JavaScript渲染，示例代碼如下：

<html>
 <head>
  <title>My First chart using FusionCharts - Using JavaScript</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/Column2D.swf", "myChartId", "400",
                                    "300", "0", "1" );
     myChart.setXMLUrl("Data.xml");
     myChart.render("chartContainer");
  // -->
  </script>
 </body>
</html>

iPhone,FusionCharts,JavaScript圖表

iPad,FusionCharts,JavaScript圖表

如果你只想渲染JavaScript圖表，只需添加下面這行代碼：

FusionCharts.setCurrentRenderer('javascript')

這行代碼將詢問FusionCharts渲染器，跳過Flash渲染，直接創建一個純JavaScript圖表。如果你想將這行代碼應用到所有的圖表，你只需在最開始聲明，而不需要在頁面的每個圖表都聲明，示例代碼如下：

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

效果圖：

標簽：

本站文章除注明轉載外，均為本站原創或翻譯。歡迎任何形式的轉載，但請務必注明出處、不得修改原文相關鏈接，如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn

文章轉載自：慧都控件

上一篇：VMProtect基礎教程（一）VM堆棧下一篇：ASPxGridView控件常用示例二：添加和初始化新行（附視頻）