高圖表 - 圖表未加載，但沒有顯示任何錯誤

我是JSON和高圖表的新手。我需要顯示高圖表的動態線條。我正在使用JSON格式。我真的很困惑我的代碼有什麼問題。我沒有在Firebug中得到任何錯誤，但圖表不是渲染。以下是我的JSON。高圖表 - 圖表未加載，但沒有顯示任何錯誤

{ 
"data": [ 
    { 
     "AccountName": "[email protected]", 
     "Campaign": [ 
      { 
       "id": 1138, 
       "name": "Samsung Corporate v2", 
       "accountid": 106680966134773, 
       "FBImpression": 0, 
       "CLImpression": 78, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 1133, 
       "name": "Samsung Corporate Fan Gate oCPM", 
       "accountid": 106680966134773, 
       "FBImpression": 0, 
       "CLImpression": 90, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 647, 
       "name": "Samsung Corporate Fan Gate", 
       "accountid": 106680966134773, 
       "FBImpression": 0, 
       "CLImpression": 0, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 646, 
       "name": "Samsung Corporate Timeline", 
       "accountid": 106680966134773, 
       "FBImpression": 0, 
       "CLImpression": 0, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 1548, 
       "name": "Sauza Tequila v2.0", 
       "accountid": 108139269338750, 
       "FBImpression": 0, 
       "CLImpression": 0, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 953, 
       "name": "Samsung Corporate Timeline O C P M", 
       "accountid": 106680966134773, 
       "FBImpression": 0, 
       "CLImpression": 0, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 738, 
       "name": "MSN EN FB", 
       "accountid": 106388236165899, 
       "FBImpression": 0, 
       "CLImpression": 0, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 1511, 
       "name": "Samsung Passions Program", 
       "accountid": 106680966134773, 
       "FBImpression": 2786134, 
       "CLImpression": 2786134, 
       "FBClick": 566, 
       "CLClick": 566, 
       "FBSpent": 679.77001953125, 
       "CLSpent": 679.77001953125, 
       "FBConnection": 396, 
       "CLConnection": 358 
      }, 
      { 
       "id": 917, 
       "name": "Samsung Passion App", 
       "accountid": 106680966134773, 
       "FBImpression": 0, 
       "CLImpression": 0, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      }, 
      { 
       "id": 1606, 
       "name": "Samsung Corporate v2 oCPM", 
       "accountid": 106680966134773, 
       "FBImpression": 0, 
       "CLImpression": 0, 
       "FBClick": 0, 
       "CLClick": 0, 
       "FBSpent": 0, 
       "CLSpent": 0, 
       "FBConnection": 0, 
       "CLConnection": 0 
      } 
     ] 
    } 
] 
}

這裏是我的html文件。

<script src="jquery.min.js" type="text/javascript"></script> 
<script src="highcharts.js"></script> 
<div id="errq" style="height: 400px"></div> 
<script> 
    $(document).ready(function() { 
     var options = { 
      chart: { 
       renderTo: 'errq', 
       type: 'line' 
      }, 
      title: { 
       text: 'shannon.way' 
      }, 
      tooltip: { 
       formatter: function() { 
        return this.series.name + ':' + '<b> ' + this.y + '</b>'; 
       }, 
       style: { 
        fontSize: '10px' 
       } 

      }, 
      credits: { 
       enabled: false 
      }, 
      yAxis: { 
       title: { 
        text: '' 
       }, 

      }, 
      xAxis: { 
       labels: { 
        enabled: false 
       } 
      }, 
      series: [{ 
       name: 'Budget Spent', 

       data: []}, 
      { 
       name: 'Impressions', 
       data: []}, 
      { 
       name: 'Clicks', 
       data: []}, 
      { 
       name: 'Likes', 
       data: []} 

            ] 
     }; 
     $.getJSON('accounts.json', null, function(data) { 
      var str = JSON.stringify(data); 

    /* options.series[0].data = data[0].CLImp;  
         options.series[1].data = data[0].CLClick; 
       options.series[2].data = data[0].CLSpent; 
       options.series[3].data = data[0].CLLikes; 
         chart = new Highcharts.Chart(options);*/ 



      var json_parsed = $.parseJSON(str); 
      var CLimp = new Array(); 
      for (var u = 0; u < json_parsed.data.length; u++) { 
       var user = json_parsed.data[u]; 
       for (i = 0; i < user.Campaign.length; i++) { 
        CLimp[i] = parseInt(user.Campaign[i].CLImpression); 

       } 

      } 
      var imp = CLimp.join(","); 
      alert(imp); 
      options.series[0].data = imp; 
      chart = new Highcharts.Chart(options); 
     }); 
    }); 
</script>

當我alert(imp);我得到78,90,0,0,0,0,0,2786134,0,0但不能弄明白爲什麼圖表不渲染。請在這方面給我建議。

來源

2012-11-01 Antony

你能給出更多關於錯誤代碼的補充嗎？使用例如Chrome（右鍵單擊） - >檢查元素。然後在檢查員的選項卡中顯示錯誤。 – damoiser

爲什麼要將對象轉換爲字符串，然後再將字符串轉換爲對象？（'var str = JSON.stringify（data）;'和'var json_parsed = $ .parseJSON（str）;'）['。.getJSON']的回調（http://api.jquery.com/jQuery。 getJSON /）已經給出了正確格式的數據（JSON解碼）。 – mgibsonbr

Highcharts不希望字符串格式的數據，但數組格式。你的問題是，你轉換你的陣列成一個字符串：

 var imp = CLimp.join(","); 
     alert(imp); 
     options.series[0].data = imp;

只需直接使用數組，它應該工作：

 options.series[0].data = CLimp;

在jsFiddle工作的例子。

來源

2012-11-02 01:06:45 mgibsonbr

高圖表 - 圖表未加載，但沒有顯示任何錯誤

回答

相關問題