ERROR TypeError: this.chart.panels[0].addLabel is not a function

[kvouriot64]

I'm having an issue when trying to create charts in Angular 10. While the chart doesn't have any problems rendering, I get this error when attempting to add a label to the first stock panel. The things I've tried so far include:

• Switching between licensed and free versions of scripts
• Recreating the project from scratch
• Individually commenting out chart properties
• Calling the validateNow/validateData functions before adding the labels
• Using the dataloader.js plugin to import csv/json data (instead of copy/pasted mock data)

All of these have yielded no success, however when import working charts from other projects, they don't seem to run into the same issue.

Here's the code for my chart

import { Component, AfterViewInit } from '@angular/core';
import { AmChartsService, AmChart } from '@amcharts/amcharts3-angular';

@Component({
  selector: 'app-chart',
  templateUrl: './chart.component.html',
  styleUrls: ['./chart.component.scss']
})
export class ChartComponent implements AfterViewInit {

  private chart: AmChart;
  private chartData = [{
    "CalendarDate": "26/12/2019",
    "Close": "72.48",
    "HaveEarnings": "0",
    "High": "72.5",
    'ImpliedVol': "20.45",
    'Low': "71.18",
    'OBV': "0",
    'Open': "71.21",
    'Ovi5DayMA': "0.6706",
    'OviNormalized': "0.9995",
    'SMA20': "68.54",
    'SMA50': "65.85",
    'SMA200': "54.7",
    'Vol_SMA21': "100603970",
    'Volume': "89749400"
  },
  {
    "CalendarDate": "27/12/2019",
    "Close": "72.48",
    "HaveEarnings": "1",
    "High": "72.5",
    'ImpliedVol': "20.45",
    'Low': "71.18",
    'OBV': "0",
    'Open': "71.21",
    'Ovi5DayMA': "0.6706",
    'OviNormalized': "0.9995",
    'SMA20': "68.54",
    'SMA50': "65.85",
    'SMA200': "54.7",
    'Vol_SMA21': "100603970",
    'Volume': "89749400"
  },
  {
    "CalendarDate": "28/12/2019",
    "Close": "72.48",
    "HaveEarnings": "0",
    "High": "72.5",
    'ImpliedVol': "20.45",
    'Low': "71.18",
    'OBV': "0",
    'Open': "71.21",
    'Ovi5DayMA': "0.6706",
    'OviNormalized': "0.9995",
    'SMA20': "68.54",
    'SMA50': "65.85",
    'SMA200': "54.7",
    'Vol_SMA21': "100603970",
    'Volume': "89749400"
  },
  {
    "CalendarDate": "29/12/2019",
    "Close": "72.48",
    "HaveEarnings": "0",
    "High": "72.5",
    'ImpliedVol': "20.45",
    'Low': "71.18",
    'OBV': "0",
    'Open': "71.21",
    'Ovi5DayMA': "0.6706",
    'OviNormalized': "0.9995",
    'SMA20': "68.54",
    'SMA50': "65.85",
    'SMA200': "54.7",
    'Vol_SMA21': "100603970",
    'Volume': "89749400"
  },
  {
    "CalendarDate": "30/12/2019",
    "Close": "72.48",
    "HaveEarnings": "0",
    "High": "72.5",
    'ImpliedVol': "20.45",
    'Low': "71.18",
    'OBV': "0",
    'Open': "71.21",
    'Ovi5DayMA': "0.6706",
    'OviNormalized': "0.9995",
    'SMA20': "68.54",
    'SMA50': "65.85",
    'SMA200': "54.7",
    'Vol_SMA21': "100603970",
    'Volume': "89749400"
  }]

  constructor(private AmCharts: AmChartsService) { }

  ngAfterViewInit(): void {

    this.chart = this.AmCharts.makeChart('chartdiv', {
      "type": "stock",
      "mouseWheelScrollEnabled": true,
      "pan": true,
      "panEventsEnabled": true,
      "color": "#FFFFFF",
      "dataDateFormat": "DD/MM/YYYY",
      
      "dataSets": [
        {
          "dataProvider": this.chartData,
          "categoryField": "CalendarDate",
          "fieldMappings": [{
            "fromField": "Open",
            "toField": "Open"
          },
          {
              "fromField": "High",
              "toField": "High"
          },
          {
              "fromField": "Low",
              "toField": "Low"
          },
          {
              "fromField": "Close",
              "toField": "Close"
          },
          {
              "fromField": "Volume",
              "toField": "Volume"
          },
          {
              "fromField": "OviNormalized",
              "toField": "OviNormalized"
          },
          {
              "fromField": "OBV",
              "toField": "OBV"
          },
          {
              "fromField": "ImpliedVol",
              "toField": "ImpliedVol"
          },
          {
              "fromField": "HaveEarnings",
              "toField": "HaveEarnings"
          },
          {
              "fromField": "Ovi5DayMA",
              "toField": "Ovi5DayMA"
          },
          {
              "fromField": "SMA20",
              "toField": "SMA20"
          },
          {
              "fromField": "SMA50",
              "toField": "SMA50"
          },
          {
              "fromField": "SMA200",
              "toField": "SMA200"
          },
          {
              "fromField": "Vol_SMA21",
              "toField": "Vol_SMA21"
          }]
        }
      ],

      'panels': [
        {
          "drawingIconsEnabled": false,
          "iconSize": 20,
          "title": 'AAPL',
          'color': '#FFFFFF',
          'marginTop': 30,
          'panEventsEnabled': false,
          'percentHeight': 55,

          "stockGraphs": [
            {
              "id": "g1",
              "type": 'candlestick',
              'openField': 'Open',
              'closeField': 'Close',
              'highField': "High",
              "lowField": "Low",
              "valueField": "Close",

              "lineColor": "#009933",
              "fillColors": "#009933",
              "negativeLineColor": "#FF0000",
              "negativeFillColors": "#FF0000",
              "proCandlesticks": true,
              'fillAlphas': 1,
              'useDatasetColors': false,
              'showBalloon': false,
              'legendValueText': 'Open:[[Open]] | High:[[High]] | Low:[[Low]] | Close:[[Close]]'
            }
          ],

          "stockLegend": {
            'markerType': 'none',
            'markerSize': 0,
            'valueTextRegular': undefined,
            'valueWidth': 250,
            'color': '#FFFFFF',
            'verticalGap': 0,
            'fontSize': 14
          }
        },
        {
          'title': 'OVI',
          "showCategoryAxis": false,
          'percentHeight': 15,
          'allowTurningOff': true,
          'stockGraphs': [
            {
              'lineThickness': 2,
              'valueField': 'OviNormalized',
              'type': 'smoothedLine',
              'lineColor': '#0000D0',
              'negativeLineColor': "#D00000",
              'useDataSetColors': false
            }
          ]
        }
        
      ],

      // "balloon": {
      //   "verticalPadding": 2
      // },

      "categoryAxis": {
        "parseDates": true
      },

      "categoryAxesSettings": {
        "equalSpacing": true,
        "maxSeries": 0,
        "startOnAxis": false,
        "axisHeight": 15,
        "axisThickness": -1,
        "offset": -5,
        "appendPeriods": 1
      },

      "panelsSettings": {
        "columnWidth": 0.6,
        "columnSpacing": 15,
        "marginRight": 50,
        "marginBottom": 2,
        "marginTop": 2,

        "numberFormatter": {
          "precision": 2,
          "decimalSeperator": '.',
          'thousandsSeperator': ','
        },
        
        'backgroundAlpha': 0,
        'backgroundColor': '#F0F0F0',
        'panelSpacing': 1,
        'plotAreaFillAlphas': 1,
        'plotAreaFillColors': ["#FFFFF4"],
        'usePrefixes': true,
        'color': '#FFFFFF'
      },

      'chartScrollbarSettings': {
        'backgroundColor': '#FFFFE7',
        'selectedBackgroundAlpha': 1,
        'selectedGraphFillAlpha': 1,
        'selectedBackgroundColor': '#66C285',
        'selectedGraphFillColor': '#009933',
        'graphFillColor': '#66C285',
        'selectedGraphLineAlpha': 1,
        'selectedGraphLineColor': 'black',
        'height': 15,
        'usePeriod': 'WW'
      },

      'periodSelector': {
        'position': 'bottom',
        'periods': [
          {
            'period': 'MM',
            'selected': false,
            'count': 4,
            'label': '4 mths'
          },
          {
            'period': 'MM',
            'selected': false,
            'count': 7,
            'label': '7 mths'
          },
          {
            'period': 'MM',
            'selected': false,
            'count': 9,
            'label': '9 mths'
          },
          {
            'period': 'YYYY',
            'selected': false,
            'count': 1,
            'label': '1 yr'
          },
        ]
      }
    });

    this.chart.panels[0].addLabel(0, "35%", "OVI", "center", 20, "#0000FF", 0, 0.2, true);
    this.chart.validateData();
  }
} 

The mock data isn't supposed to actually represent anything but more of a means to just populate the dataProvider property. All the scripts are also in the right order in my index.html file