Angular highchart с динамикой c данные из API

Question

Этот код Angular получает данные из API и создает сплайн-диаграмму с этими данными API в angular highcharts.

Это файл app.component.ts

import { Component, OnInit } from "@angular/core";
import * as Highcharts from "highcharts";
import { DashService } from './shared/dash.service';
import { Chart } from './shared/chart.model';


@Component({
  selector: "my-app",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})

export class AppComponent implements OnInit{
    ChartModel: Chart[];
    url: string = 'https://localhost:44311/api/charts/';
    data: any;

   constructor(public service: DashService) { }

   Highcharts = Highcharts;

    spline = {
    chart: {
   type: 'spline',
    },
    title: {
    text: 'Active Users'
    },
    credits: {
    enabled: false
    },
    yAxis: {
      title: {
         text: 'Users'
         }
    },
    series: []
    }
    ngOnInit() {

    this.getApiResponse(this.url).then(
    data => {
    const values = [];
    data.forEach(row => {
    const temp_row = [row.data,];    
    values.push(temp_row);
    });
    var dataSeries = [];

    dataSeries.push({
    name:'Users Present',
    data: values,
    });

    this.spline.series = dataSeries;
    },
    error => {
    console.log('Something went wrong.');
    })
    }
    getApiResponse(url) {
    return this.service.Get(this.url)
    .toPromise().then(res => {
    return res;
    });
    }
    }

Это файл da sh .service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Chart } from './chart.model';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class DashService {

  readonly chartURL = "https://localhost:44311/api/charts/"
  constructor(private http: HttpClient) { }

  Get(chartURL):Observable<Chart[]>{
  return this.http.get<Chart[]>(chartURL);
 }
}

Это файл chart.model.ts

export class Chart {
    data:number;
}

И это app.component. html

<div class="chart-box" class="col-lg-5 md-5 ml-5" > 
        <highcharts-chart [Highcharts]="Highcharts" [options]="spline"></highcharts-chart>
</div>

Я обновил свой файл app.component.ts, а также добавил файлы da sh .service.ts и model.ts. Теперь я могу получать данные для своей диаграммы из API, единственное, что я хочу сделать, это обновлять диаграмму каждые 5 секунд и продолжать добавлять к ней точки из API.

Этот веб-сайт показывает высокие диаграммы с динамическими c данными. Линейная диаграмма справа обновляется каждые 5 секунд, добавляя к ней точки, и я хочу, чтобы это тоже было сделано в моей диаграмме. Указанный веб-сайт не мой, это просто справочная информация. Это - еще одна ссылка, которая добавляет точку каждую секунду, я хочу то же самое с моей диаграммой Пожалуйста, помогите мне сделать мою диаграмму динамической c вот так

Ниже изображение моей диаграммы