High Charts не может динамически добавлять серии

Я впервые использую HighCharts, и мне сложно найти источники, которые помогли бы мне с этой проблемой.

Я пытаюсь отобразить несколько диаграмм с разным количеством серий. Вместо того, чтобы настраивать несколько шаблонов параметров, я хочу использовать только один и использовать функцию для настройки объекта параметров каждый раз. Здесь я предоставил фиктивные данные о том, как будет выглядеть одна из диаграмм, полученная от API. В приложении планирую кормить его из HTML.

Я продолжаю сталкиваться с различными проблемами из-за моего непонимания HighCharts, прямо сейчас я просто хожу по кругу, исправляя одну проблему, только для того, чтобы прошлая проблема всплыла снова. Я надеялся, что кто-то может указать мне в правильном направлении. Это мой класс:

export class CompletenessTabComponent implements OnInit, AfterViewInit {
  @ViewChild('chartTarget') chartTarget: ElementRef;

  chart: Highcharts.ChartObject;

  dataObj = {"id":0,
    "tableName":"d1 vs d2",
    "data":{"d1Count":[50,45,55,60,70],
      "d2Count":[40,32,55,58,33],
      "Errors":[2,3,4,1,0]},
    "dates":[20180927,20180928,20181001,20181002,20181003]
  };

  constructor() { }

  setHighChartOptions(data, seriesNames, chartTitle ): any {
    count = 1;
    highChartOptions.title.text = chartTitle;
    highChartOptions.xAxis.data = data.dates;
    this.chart.series[0].setData(this.dataObj.data[0]);
    Object.keys(data.data).forEach((key) =>
      this.chart.addSeries({
        name: seriesNames[count],
        data: data.data[key],
        type: 'line'
      }) count ++
    );
    return highChartOptions;
  }
  getHighChartOptions(){
    return highChartOptions;
  }
  ngOnInit() {
    this.chart = chart(this.chartTarget.nativeElement, this.setHighChartOptions(this.dataObj, ['d1', 'd2', 'error'], this.dataObj.tableName));
    Object.keys(this.dataObj.data).forEach(key =>
    console.info(key, this.dataObj.data[key]))
  }
  ngAfterViewInit() {
  }

}

const highChartOptions = {
  colors:
    ['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4'],

  credits: {
    enabled: false
  },
  chart: {
    backgroundColor: null,
  },
  legend: {
    layout: 'vertical',
    align: 'right',
    verticalAlign: 'top',
    itemStyle: {
      fontSize: '10px',
      fontWeight: 'normal'
    }
  },
  tooltip: {
    valuePrefix: '$'
  },
  title: {
    text: ''
  },
  xAxis: {
    type: 'date',
    data: [],
    title: 'date'
  },
  yAxis: {
    title: {
      align: 'middle',
      rotation: 0,
      text: ''
    }
  },
  plotOptions: {
    series: {
      marker: {
        enabled: false
      },
      shadow: false
    }
  },
  series: [{
    type: 'line',
    name: '',
    data: [null]
  }]
};

Я продолжаю получать следующие ошибки:

in setHighChartOptions() : Cannot read property 'series' of undefined (at, this.chart.series[0]), & cannot read 'keys' of undefined (at the start of the ForEach loop).

Я считаю, что большая проблема заключается в том, что объект диаграммы не определен, что не имеет смысла, поскольку я создал его в верхней части класса, а затем onInit я установил параметры диаграммы.

Надеюсь, вы сможете обнаружить мои ошибки и помочь мне. Спасибо.