График с использованием Highcharts с множественной серией из JSON

Question

У меня есть JSON файл в следующем формате:

[ 

    { name: 'Pay Off', 
    data: [ [2850,0], 
      [3135,0], 
      [3420,0], 
      [3705,0], 
      [3990,0], 
      [4275,0], 
      [4560,0], 
      [4845,0], 
      [5130,0], 
      [5415,0], 
      [5700,0], 
      [5985,285], 
      [6270,570], 
      [6555,855], 
      [6840,1140], 
      [7125,1425], 
      [7410,1710], 
      [7695,1995], 
      [7980,2280], 
      [8265,2565], 
      [8550,2850] 
     ] 
}, 

{ 
    name: 'Profit', 
    data: [ [2850,-250],  
      [3135,-250], 
      [3420,-250], 
      [3705,-250], 
      [3990,-250], 
      [4275,-250], 
      [4560,-250], 
      [4845,-250], 
      [5130,-250], 
      [5415,-250], 
      [5700,-250], 
      [5985,35], 
      [6270,320], 
      [6555,605], 
      [6840,890], 
      [7125,1175], 
      [7410,1460], 
      [7695,1745], 
      [7980,2030], 
      [8265,2315], 
      [8550,2600] 
     ] 
    } 
] 

я должен построить график «Pay Off» и «прибыль» вместе. В список можно добавить еще больше сюжетов. Массив данных имеет ось x как 0-й элемент и ось y как 1-й элемент. То, что я сейчас делаю это следующее -

$(document).ready(function() { 
    var options = { 
     chart: { 
      renderTo: 'container', 
      type: 'line' 
      }, 
    title: { 
     text: 'PayOff Curve' 
    }, 
    legend: { 
      layout: 'vertical', 
      align: 'right', 
      verticalAlign: 'middle', 
      borderWidth: 0 
    }, 
    series: [] 
}; 
$.getJSON('data.json', function(list) { 
    var newseries = { 
     name: '', 
     data: [] 
    }; 

    $.each(list, function(i,item){ 
     newseries.name = item.name; 
     newseries.data = item.data; 
     options.series.push(newseries);  
    }); 

      // Create the chart 
    var chart = new Highcharts.Chart(options); 
    }); 

Но я не какой-либо график вообще. Я не могу понять эту проблему, поскольку я новичок в JavaScript и Python. Пожалуйста, предложите эффективный метод для этого. Спасибо за вашу помощь ..

Answer 1

Ваш JSON не подходит, попробуйте его проверить. Имена свойств, хранящихся в двойных кавычках, изменяются от: name: 'Pay Off' до: "name": "Pay Off"

Answer 2

Ваш JSON действителен для серии Highcharts - вам не нужно, чтобы попытаться превратить его вообще:

$(document).ready(function() { 
    var options = { 
     chart: { 
      renderTo: 'container', 
      type: 'line' 
     }, 
     title: { 
      text: 'PayOff Curve' 
     }, 
     legend: { 
      layout: 'vertical', 
      align: 'right', 
      verticalAlign: 'middle', 
      borderWidth: 0 
     }, 
     series: [] 
    }; 
    $.getJSON('data.json', function(list) { 
     options.series = list; // <- just assign the data to the series property. 
     var chart = new Highcharts.Chart(options); 
    }); 
}); 

Если это все еще не работает, откройте чтобы увидеть, есть ли ошибка JavaScript.

Вот fiddle.