title: Spline HighChart not plotting lines using angular 4
body: <p>I am building a spline high chart in angular 4. I have build the series and can see the data while adding it to the series however the series for some reason doesn't seem to be assigning to the chart. If i hard code the values in the series array in the spline chart component it plots the lines. There is something wrong with my assignment of series. Not sure what it is ?</p>
  
  <p>spline chart component</p>
  
  <pre><code>import { Component, Input, OnChanges } from '@angular/core';
  
  
  @Component({
      selector: 'splinechart',
      template: '&lt;chart [options]="options" (load)="getInstance($event.context)"&gt;&lt;/chart&gt;',
      styles: [`
      chart {
          display: block;
          width: 100% !important;
           padding:0;
        }        
      `]
  })
  
  export class SplineChartComponent implements OnChanges {
      public options: any;
      chart: any;
  
      @Input() public series: any;
  
      @Input() public selectedRating: string = '';
  
      constructor() {
          this.options = {
              credits: {
                  enabled: false
              },
              chart: {
                  type: 'spline'
              },
              legend: {
                  align: 'center',
                  verticalAlign: 'top',
                  layout: 'horizontal',
                  margin: 5,
                  itemMarginTop: 50
  
              },
              title: { useHTML: true, text: null, align: "left", margin: 50 },
              xAxis: {
                  min: 1,
                  allowDecimals: false,
                  title: { margin: 30 }
  
              },
  
  
              yAxis: {
                  min: 0,
                  title: {
                      text: '',
                      margin: 30
                  },
                  categories: [
  
                  ],
                  allowDecimals: false,
  
              },
              tooltip: {
  
              },
              plotOptions: {
                  spline: {
                      lineWidth: 10,
                      states: {
                          hover: {
                              lineWidth: 5
                          }
                      },
                      marker: {
                          enabled: false
                      },
                  }
              },
              series: []
          };
      }
  
  
      getInstance(chartInstance): void {
          this.chart = chartInstance;
          this.redraw();
      }
  
  
      ngOnChanges(data: any) {
          if (!data.series.currentValue || !this.chart) return;
          data.series.currentValue.map(s =&gt; {
              this.chart.addSeries(s);
          });
          this.chart.reflow();
      }
  
      redraw() {
          if (!this.chart) return;
          this.series.map(s =&gt; {
              if(s!=null)
              this.chart.addSeries(s);
          });    
      }
  
  }
  </code></pre>
  
  <p>stress test component (Builds series for the chart)</p>
  
  <pre><code>import { Component, OnInit, Input } from '@angular/core';
  import { StressTestAnalysis } from '../../../../api/dtos';
  
  @Component({
    selector: 'app-stress-test-analysis',
    templateUrl: './stress-test-analysis.component.html',
  })
  export class StressTestAnalysisComponent implements OnInit {
    isExpanded = false;
    showTable = true;
    @Input() results: Array&lt;StressTestAnalysis&gt; = [];
  
    chartSeries : any[] = [];
    yAxis: any[]=[];
    minYAxis : number;
    maxYAxis : number;
  
  
    constructor() { }
  
    ngOnInit() {
  
       this.results.map(r =&gt; {
          this.chartSeries.push(r.data);
          this.yAxis.push(r.yaxis);
  
       });
  
    }
  
  
  }
  </code></pre>
  
  <p>Stress test  html (container for the chart)</p>
  
  <pre><code> &lt;div *ngIf="!showTable" class="tab-pane base-strategy-chart fade show active" id="base-strategy-chart--nva" role="tabpanel"
            aria-labelledby="chart-tab"&gt;
            &lt;div class="tb-container"&gt;
  
              &lt;div class="tb-row d-flex flex-row"&gt;
                &lt;div class="tb-cell col-6"&gt;&lt;/div&gt;
  
                  &lt;splinechart [series]="chartSeries"&gt;
                 &lt;/splinechart&gt;
  
              &lt;/div&gt;
            &lt;/div&gt;
  </code></pre>