Как добавить точки данных в plotly.js в оболочке Angular 2+

Question

Кто-нибудь может сказать, как использовать функцию exteTraces в Plotly.js в оболочке Angular 2+ (https://github.com/plotly/angular-plotly.js) для plotly.js? Я не могу понять это по документам, указанным в URL.

Относится к вопросу: Обновление данных по частям

**** решение **** Ниже я изменил свой исходный почтовый индекс, чтобы показать работающее решение. Методы addPoint и addPoint2 (добавитьновые отдельные данные указывают на существующий ряд) Метод addRandomLine () добавляет новый след (т. е. целый новый ряд данных):

<button (click)="addRandomLine()" class="button">Add random line</button>
<button (click)="addPoint()" class="button">Add point to 1. series</button>
<button (click)="addPoint2()" class="button">Add point with extendTrace to 1. series</button>

<plotly-plot 
    #chart
    id="plotlyChart"
    [data]="data" 
    [layout]="layout">
</plotly-plot>


import { Component, ViewChild } from '@angular/core';
import { PlotlyService } from '../../shared/plotly.service';

export class LinearChartsComponent {

@ViewChild('chart') el: any;

    public data: any[] = [
        { x: [1, 2, 3, 4], y: [10, 15, 13, 17], type: 'bar',  mode: 'markers', name: 'Bar' },
        { x: [2, 3, 4, 1], y: [16, 5, 11, 9], type: 'scattergl', mode: 'lines', name: 'Lines' },
        { x: [1, 2, 3, 4], y: [12, 9, 15, 12], type: 'markers', mode: 'lines+markers', name: 'Scatter + Lines' },
    ];

constructor(public plotly: PlotlyService) {
}


    public layout: any = {
        title: 'Adding Names to Line and Scatter Plot',
    };

    public addRandomLine() {
        const line: any = { x: [], y: [], mode: 'lines', name: 'Line ' + this.data.length };

        line.x = [1, 2, 3, 4].map(i => Math.round(Math.random() * 10));
        line.y = [1, 2, 3, 4].map(i => Math.round(Math.random() * 20));
        line.mode = ['markers', 'lines', 'lines+markers'][Math.floor(Math.random() * 3)] as any;

        this.data.push(line);
    }


// adds point with relayout-method
addPoint() {

    const line: any = this.data[1];
    line.x.push(line.x.length + 1);
    line.y.push(Math.round(Math.random() * 20));
    this.data[1] = line;

    const update = {
        title: 'New Title',
        data: this.data
    }
    this.plotly.getPlotly().relayout(this.el.plotEl.nativeElement, update);

}

// adds point with extendTraces-method
addPoint2() {
    this.plotly.getPlotly().extendTraces(
        this.el.plotEl.nativeElement,
        { y: [[Math.random()*10]] }, [1]
    );
    this.plotly.getPlotly().extendTraces(
        this.el.plotEl.nativeElement,
        { x: [[this.data[1].x.length + 1]] }, [1]
    );
}

}