2014-02-27 34 views
0

我想在我的aspx頁面實現this highchart。我有我的這兩個js文件,並添加像如何在我的aspx頁面加載highchart

<script src="../UserInfo/Charts/highcharts.js" type="text/javascript"></script> 
<script src="../UserInfo/Charts/highcharts.js" type="text/javascript"></script> 

參考和粘貼代碼的功能類似

<script language="javascript" type="text/javascript">  
window.onload = function() { 
    var oContainer = document.getElementById("container"); 

    //  $(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'line' 
     }, 
     title: { 
      text: 'Yearly In/Out Transaction Chart' 
     }, 
     subtitle: { 
      text: ' Financial Year 12-13' 
     }, 
     xAxis: { 
      categories: ['Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', 'Jan', 'Feb', 'Mar'] 
     }, 
     yAxis: { 
      title: { 
       text: 'Transaction Amount' 
      } 
     }, 
     tooltip: { 
      enabled: true, 
      formatter: function() { 
       return '<b></b><br/> In Out'; 
      } 
     }, 
     plotOptions: { 
      line: { 
       dataLabels: { 
        enabled: true, 
        style: { 
         textShadow: '0 0 3px white, 0 0 3px white' 
        } 
       }, 
       enableMouseTracking: false 
      } 
     }, 
     series: [{ 
      name: 'Receipt', 
      data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6] 
     }, { 
      name: 'Payment', 
      data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8] 
     }, { 
      name: 'Balance', 
      data: [3.1, 4.0, 5.1, 8.1, 11.1, 15.1, 17.2, 16.8, 14.0, 10.3, 6.6, 40.10] 
     }] 
    }); 
    //  }); 

} 

</script> 

即使是圖形沒有加載。我曾嘗試與

<script src="http://code.highcharts.com/highcharts.js"></script> 

這些引用也。如果我將警報保留在函數中,它不會觸發。它在jsFiddler中工作正常。爲什麼不在我的頁面。我是否錯過了任何推薦。 ???

+0

Hicharts取決於jQuery的 - 你引用了jQuery庫還? (例如:) –

+0

@DaveLong:是的。事件圖表未加載 –

+0

您是否在控制檯收到任何錯誤? –

回答

0

你錯過了這兩條線在你的代碼

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 

<div id=container></div> 
+0

沒有沒有..這是版本問題,我在我上次評論中提到。 –