title: Highcharts: how do I add full data to multiple series in a chart
body: <p>This is a question similar to one (Highcharts parsed drilldown not showing on page but does in console) but is trying to do things slightly different (that one works (thanks Pawel/Salman), so I'm asking as a new question).  I am creating a column chart with multiple series with drilldown.  The data comes from a CSV file (the jsFiddle uses a mockup, thanks to Pawel on how to do that).  </p>
  
  <p>I need the series set up as in the Highcharts API with [name: x, data[{name: Y, y: Z, drilldown: id}]].  The problem I have is that the series appears in the log as a correct series of arrays with the data in the format required, but the data is not being pushed to the actual series[].  I have modified code below and it is in the jsFiddle:  <a href="https://jsfiddle.net/49jLf4xo/1/" rel="nofollow">https://jsfiddle.net/49jLf4xo/1/</a>.</p>
  
  <pre><code>$('#container').highcharts({
     chart: {
            type: 'column',
            events: {
            load: function () {
  
                var csvData = document.getElementById("data").innerHTML;
                var lines = csvData.split('\n');
                var drilldown = {
                        series: []
                  };
                  var seriesData = [];
                     $.each(lines, function (lineNo, line) {
  
                         if (lineNo &gt; 0 &amp;&amp; lineNo &lt; 4) {
                                 var items = line.split(',');
                                 var seriesname = String(items[0]); // this is the area name
                                 var area_cost = parseFloat(items[1]); // area rollup
                                 var drill_id = String(items[2]); // id of the drilldown
                                 var shift_one_value = parseFloat(items[3]); // drilldown shift1 value
                                 var shift_two_value = parseFloat(items[4]); // drilldown shift2 value
  
                        if (!isNaN(area_cost) &amp;&amp; !isNaN(shift_one_value) &amp;&amp; !isNaN(shift_two_value)) {
  
                                          seriesData.push({
                                              name: seriesname,
                                              data: ({
                                                  name: seriesname,
                                                  y: area_cost,
                                                  drilldown: drill_id
                                              })
                                          });
  
                                          drilldown.series.push({
                                              id: drill_id,
                                              data: [
                                                  ["shift1", shift_one_value],
                                                  ["shift2", shift_two_value]
                                              ]
                                          });
                                      }
                                  }
  
                              });
  
                              drilldown = drilldown;
                              series = [seriesData];
                              console.log(series);
                      }
                  },
  
                  title: {
                      text: 'My Title Here'
                  },
                  xAxis: {
                      type: 'category'
                  },
                  yAxis: {
                      title: {
                          text: 'Value Here'
                      }
                  },
                  legend: {
                      enabled: false
                  },
                  tooltip: {
                      shared: true,
                      crosshairs: true
                  },
  
                  plotOptions: {
                      series: {
                          borderWidth: 0,
                          dataLabels: {
                              enabled: true
                          },
                          colorByPoint: true
                      }
                  },
  
                  series: [],
  
                  drilldown: {
                      drillUpButton: {
                          relativeTo: 'spacingBox',
                          position: {
                              y: 0,
                              x: 0
                          },
                          theme: {
                              fill: 'white',
                              'stroke-width': 1,
                              stroke: 'silver',
                              r: 0,
                              states: {
                                  hover: {
                                      fill: '#bada55'
                                  },
                                  select: {
                                      stroke: '#039',
                                      fill: '#bada55'
                                  }
                              }
                          }
  
                      },
                      allowPointDrilldown: false,
                      activeAxisLabelStyle: {
                          textDecoration: 'underline',
                          fontStyle: 'italic'
                      },
                      activeDataLabelStyle: {
                          textDecoration: 'none',
                          fontStyle: 'italic'
                      }
                  }
              }
          });
  </code></pre>
  
  <p>Where the data is of the format</p>
  
  <pre><code>&lt;div id="data"&gt;AREA,VALUE,TYPE,SHIFT1,SHIFT2
      Blog1,50000,Blog1_Shift,5,6
      Blog2,60000,Blog2_Shift,2,3
      Blog3,40000,Blog3_Shift,7,8
  &lt;/div&gt;
  </code></pre>
  
  <p>I don't have enough rep to post an image of the console, but it looks like this:
  I don't have enough rep to post an image of the console, but the "series" looks like the data below.</p>
  
  <pre><code>Overall it shows:
  [object Array]  [Array[3]]
    0
    1
    2
  </code></pre>
  
  <p>Where the first (0) expands like this:</p>
  
  <pre><code>[object Array]                      [Array[3]]
    0                                 [object Array][...]
      0                               [object Object] {...}
        [functions]
          __proto__                   [object Object] {...}
          data                        [object Object] {...}
             [functions]
             __proto__                [object Object] {...}
             drilldown                "Blog1_Shift"
             name                     "Blog1"
             y                        50000
           name                       "Blog1"
  </code></pre>
  
  <p>It is the same for the other 2 arrays.</p>
  
  <p>I am getting nothing but the title on the screen, nothing else shows up.</p>
  
  <p>I have tried putting in .addSeries, as well as a few things from somewhat similar posts and those got me no further  Does someone have an idea where I am going wrong with this?  Any help is appreciated.  </p>
  
  <p>Thanks</p>