Angular6 如何在angular 8中使用web api创建动态图表

我正在使用画布创建条形图。我创建了一个静态图表，但我需要一个动态图表。我需要使用web API从后端获取数据。

这是用于折线图和饼图的

<canvas baseChart [datasets]="lineChartData"
    [labels]="lineChartLabels" [options]="lineChartOptions"
    [colors]="lineChartColors" [legend]="lineChartLegend"
    [chartType]="lineChartType" [plugins]="lineChartPlugins">
</canvas>

<canvas baseChart [data]="pieChartData" [labels]="pieChartLabels"
        [chartType]="pieChartType" [options]="pieChartOptions"
        [plugins]="pieChartPlugins" [legend]="pieChartLegend"
        (chartClick)="chartClicked($event)">
</canvas>

在ngoninit，你可以打电话

 this.http.get( 'getGraphJSON' ).subscribe(( data ) => {
        this.chartflag = true
        this.lineChartData.push( data["linechartData"] );
        this.lineChartLabels = data["lineChartLabels"];
        this.pieChartLabels = data["pieChartLabels"];
        this.pieChartData = data["pieChartData"];

    } ) 

JSON:

---

这里我们想看看代码。你能提供一个最小的运行样本吗？另外，请在此处阅读本指南“如何提出一个好问题”：

 this.http.get( 'getGraphJSON' ).subscribe(( data ) => {
        this.chartflag = true
        this.lineChartData.push( data["linechartData"] );
        this.lineChartLabels = data["lineChartLabels"];
        this.pieChartLabels = data["pieChartLabels"];
        this.pieChartData = data["pieChartData"];

    } ) 

{"pieChartLabels":["Nursing ","333999-Machinery Manufacturing","-Nursing Facilities","Social ","Electronic Product ","srvices","Social ","Professional, Scientific, and Technical Services","Repair and Maintenance","Transportation Equipment Manufacturing","Professional, Scientific, and Technical Services","Computer and Electronic Product Manufacturing","Crop Production","Publishing Industries (except Internet)","Machinery Manufacturing","Construction of Buildings"],"pieChartData":[83,57,42,41,37,33,33,33,12,12,9,9,4,3,3,3],"lineChartLabels":["Jun","Oct","Nov","Dec"],"linechartData":{"data":[1,2,5,423],"label":"Opportunity"}}