無法顯示JSON數據在線高圖

我是新的與高圖工作。我有json格式的字符串，我用newtonsoft創建它。這串的格式如下圖所示：無法顯示JSON數據在線高圖

[{"Name":"Month","Data":["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},{"Name":"Erlang","Data":[50,72,106,129,144,176,136,148,216,194,96,54]}]

我想將它導入到在JavaScript中highchart。該Java腳本代碼：

$(document).ready(function() { 
 
      var options = { 
 
       chart: { 
 
        renderTo: 'container', 
 
        type: 'line', 
 
        marginRight: 130, 
 
        marginBottom: 25 
 
       }, 
 
       title: { 
 
        text: 'Erlang', 
 
        x: -20 //center 
 
       }, 
 
       subtitle: { 
 
        text: '', 
 
        x: -20 
 
       }, 
 
       xAxis: { 
 
        categories: [] 
 
       }, 
 
       yAxis: { 
 
        title: { 
 
         text: 'Amount' 
 
        }, 
 
        plotLines: [{ 
 
         value: 0, 
 
         width: 1, 
 
         color: '#808080' 
 
        }] 
 
       }, 
 
       tooltip: { 
 
        formatter: function() { 
 
         return '<b>' + this.series.Name + '</b><br/>' + 
 
         this.x + ': ' + this.y; 
 
        } 
 
       }, 
 
       legend: { 
 
        layout: 'vertical', 
 
        align: 'right', 
 
        verticalAlign: 'top', 
 
        x: -10, 
 
        y: 100, 
 
        borderWidth: 0 
 
       }, 
 
       series: [] 
 
      } 
 

 
      $.getJSON("../../api/Chart/GetLineJson", function (json) { 
 
       options.xAxis.categories = json[0]['Data']; 
 
       options.series[0] = json[1]; 
 
       chart = new Highcharts.Chart(options); 
 
      }); 
 
     });

但它不工作。控制器之間的url （api/Chart/GetLineJson）工作正常。我找不到問題所在。

來源

2016-01-10 Arghavan

您需要將您的json響應中的Name和Data鍵更改爲小寫。

[ 
    { 
     "name": "Month", 
     "data": ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"] 
    }, 
    { 
     "name": "Erlang", 
     "data":[50,72,106,129,144,176,136,148,216,194,96,54] 
    } 
]

工作jsbin例如

來源

2016-01-10 10:29:59 xkcd149

我把它改爲小寫，但它不工作了。當我在js中硬編碼數據，就像你的示例它的工作原理，但是當我從控制器（../../ api/Chart/GetLineJson）導入數據時，它不起作用。我確信json文件的格式是正確的，但GetLineJson的結果是一個字符串。這種類型有什麼問題嗎？ – Arghavan

運行[控制檯]（https://developers.google.com/web/tools/chrome-devtools/debug/console/console-ui）並觀察你有什麼樣的錯誤 –

我使用var jsondata = getJSON中的JSON.parse（json）:)非常感謝您的幫助。 – Arghavan

無法顯示JSON數據在線高圖

回答

相關問題