Highchart ajax請求

Question

搜索網絡後，我決定終於提出問題。

我目前使用PHPExcel訪問xlsx數據，我也使用jQuery Highcharts;兩者在單獨使用時都有效。我發現了幾種使用不同XHR方法的highcharts方法。我想知道的是，如果它可能與下面的代碼。我可以獲得結果，從PHP返回的JSON包含10個對象，我可以在控制檯中看到它們。我的問題在於數據。輸出插入最後JSON物體放入x軸的第一時隙，並跳過第9，

$(function() {      
    var chart; 
    $(document).ready(function() { 
     chart1 = new Highcharts.Chart({ 

      chart: { 
       renderTo: 'container', 
       zoomType: 'xy' 
      }, 
      title: { 
       text: 'Market Size & Trading Report' 
      }, 
      subtitle: { 
       text: 'Source: Some Source' 
      }, 
      xAxis: [{ 
       categories: [], 

      }], 
      yAxis: [{ // Primary yAxis 
       labels: { 
        formatter: function() { 
         return this.value +'m'; 
        }, 
        style: { 
         color: '#000' 
        } 
       }, 
       title: { 
        text: 'Market Size', 
        style: { 
         color: '#000' 
        } 
       } 
      }, { // Secondary yAxis 
       title: { 
        text: 'Percent', 
         style: { 
         color: '#4572A7' 
        } 
       }, 
      labels: { 
       formatter: function() { 
        return this.value +' %'; 
       }, 
       style: { 
        color: '#4572A7' 
       } 
      }, 
      opposite: true 
     }], 
     tooltip: { 
      formatter: function() { 
       return ''+ 
        this.x +': '+ this.y + 
        (this.series.name == 'Percent' ? ' %' : 'm'); 
      } 
     }, 
     legend: { 
      layout: 'vertical', 
      align: 'left', 
      x: 200, 
      verticalAlign: 'top', 
      y: 50, 
      floating: true, 
      backgroundColor: '#FFFFFF' 
     }, 
     series: [{ 
      name: 'Market Size', 
      color: '#4572A7', 
      type: 'column', 
      yAxis: 0, 
      data: [6.7,7.0,6.8,6.6,6.4,6.8,6.5,6.3,6.3,6.4] 

     }, { 
      name: 'P Market Size', 
      color: '#89A54E', 
      type: 'spline', 
      yAxis: 1, 
      data: [9, 8.4, 8.3,8.1,8.6,8.8,8.7,8.4,8.9,8.6] 
     },{ 
      name: 'D Market Size', 
      color: '#FFCC00', 
      type: 'spline', 
      yAxis: 1, 
      data: [1.7,1.7,1.8,1.8,2.0,1.8,1.7,1.7,1.7,1.71] 
     }] 
    }); 


    $.ajax({ 
       type: "GET", 
       dataType: "json", 
       url: 'http://devtest.localhost/screen-tests/excelReader/Tests/marketSizeandShareGraph.php', 
       success: function (data) { 
       var i; 
         $.each(data, function (k, v) { 

           chart1.xAxis[0].setCategories([v.heading]) ; 

         }); 
         } 
         }); 

}); 

}）;

你有什麼想法嗎？

Answer 1

我認爲你需要一次設置所有的類別。例如：

var myCategories = []; 
$.each(data, function (k, v) { 
    myCategories.push(v.heading); 
} 
char1.xAxis[0].setCategories(myCategories); 

每次調用setCategories也會導致圖表重新繪製，所以調用一次會更好。