title: Charts using Highcharts with multiple series from JSON
body: <p>I have a JSON file of the following format :</p>
  
  <pre><code>[
  
    { 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]
          ]
      }
  ]
  </code></pre>
  
  <p>I have to plot graph for 'Pay Off' and 'Profit' together. Even more plots maybe added to the list as per requirement. The data array has x-axis as 0th element and y-axis as 1st element. 
  What I am currently doing is the following - </p>
  
  <pre><code>$(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);
    }); 
  </code></pre>
  
  <p>But I don't any graph at all. I can't figure out the issue with it as I am new to both JavaScript and Python. Please suggest an efficient method to do this.
  Thanks for your help..</p>