2014-09-21 89 views
0

我們使用Highcharts後不工作jQuery的升級

highcharts 2.5.1 back in 2011 bundled with Jquery 1.4.2 

一些圖形和一切工作OK但我們節省一些其他的JavaScript插件和他們我們需要對它們進行升級,以及latest releases have some bug fixed and we want to take advantage of them,他們還需要Jquery upgrade as well但當我升級到最新jquery version

jquery-1.11.1.min然後highcharts似乎不再有效?

我能做些什麼,使之可以作爲使用JQuery 1.4.2

示例代碼

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>Highcharts Example</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>  
    <script type="text/javascript" src="../js/highcharts.js"></script> 
    <script type="text/javascript"> 

     var chart; 
     $(document).ready(function() { 
      chart = new Highcharts.Chart({ 
       chart: { 
        renderTo: 'container', 
        defaultSeriesType: 'bar' 
       }, 
       title: { 
        text: 'Stacked bar chart' 
       }, 
       xAxis: { 
        categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'] 
       }, 
       yAxis: { 
        min: 0, 
        title: { 
         text: 'Total fruit consumption' 
        } 
       }, 
       legend: { 
        backgroundColor: '#FFFFFF', 
        reversed: true 
       }, 
       tooltip: { 
        formatter: function() { 
         return ''+ 
          this.series.name +': '+ this.y +''; 
        } 
       }, 
       plotOptions: { 
        series: { 
         stacking: 'normal' 
        } 
       }, 
        series: [{ 
        name: 'John', 
        data: [5, 3, 4, 7, 2] 
       }, { 
        name: 'Jane', 
        data: [2, 2, 3, 2, 1] 
       }, { 
        name: 'Joe', 
        data: [3, 4, 4, 2, 5] 
       }] 
      });       
     });    
    </script>  
</head> 
<body> 
    <div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div> 
</body> 

產生正確的輸出

Using JQuery 1.4.2

如果我改變JQuery version這樣的

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>  

產生類似的東西。

我看到類似

Using jQuery 1.11

also tested con JQuery 1.10

+1

您所看到的問題是什麼?在JavaScript控制檯中的任何錯誤?請在 – 2014-09-21 15:00:24

+0

這個問題上提供足夠的信息,我沒有看到圖形,而在其他圖形中沒有顯示數據。 – chiperortiz 2014-09-21 16:33:54

+0

代碼適用於最新的高級圖表和jquery http:// jsfiddle。net/jugal/9g3679zk /你正在使用什麼版本的highcharts?根據您的許可更新到最新的可用版本 – 2014-09-22 06:22:35

回答

3

檢查您是否可以在compatibility page of highcharts

jQuery 

1.4.3 - 1.10.x for all browsers. 
2.0.x for modern browsers. 

嘗試使用1.10.x。如果你仍然看到這個問題,我會建議在這裏創建一個jsFiddle問題&報告。 SO專家或Highcharts支持團隊可以在您使用官方支持的jQuery版本時爲您提供幫助。

編輯

您的代碼效果很好,看看@http://jsfiddle.net/jugal/9g3679zk/

您可能還需要升級Highcharts JS

EDIT 2

使用Highcharts 2.1.5 @http://jsfiddle.net/jugal/9g3679zk/1/圖表不會像您所顯示的那樣加載,而是在重新調整窗口大小後重新繪製並顯示圖表。

升級到2.2似乎可以解決它@http://jsfiddle.net/jugal/9g3679zk/2/您最有可能應該能夠使用現有許可證從2.1升級到2.2。

+0

我會嘗試升級'Highcharts.js'我會將你的評論標記爲解決方案。非常感謝... – chiperortiz 2014-09-22 18:45:13

相關問題