如何在 angular 中制作如下图所示的图表

Question

由于我是 Angular 的新手，我在 Graph 中遇到问题，我现在不知道如何在 angular

中制作它

尝试使用 Chart.js 和 Canvasjs 我都遇到了问题 1. 使用 Chart.js 我能够创建如下图所示的静态图，但我不知道如何从 API 获取该图的数据。

注意：我可以使用 API 显示任何类型的数据，但图形除外所以，请帮我处理这个图形问题。

LineChart = {};

  ngOnInit() {
    // Line chart:
    this.LineChart = new Chart('lineChart', {
      type: 'line',
      data: {
        labels: ['Jan', 'Feb', 'March', 'April', 'May', 'June', 'July', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        datasets: [{
          label: 'Number of Items Sold in Months',
          data: [9, 7, 3, 5, 2, 10, 15, 16, 19, 3, 1, 9],
          fill: false,
          lineTension: 0.2,
          borderColor: 'white',
          borderWidth: 1
        }]
      },
      options: {
        title: {
          text: 'Line Chart',
          display: true
        },
        scales: {
          yAxes: [{
            ticks: {
              beginAtZero: true
            }
          }]
        }
      }
    });

注意：我可以使用 API 显示任何类型的数据，但图形除外所以，请帮我处理这个图形问题。

图表应该来

Answer 1

在初始化图表对象之前，从 API 获取数据并创建数据数组，然后初始化图表对象。

如果你希望图表不断变化，使用 Observables 不断获取数据并不断更新图表。

如何在 angular 中制作如下图所示的图表

How to make Graph like below image in angular

api

json

graph

linechart

angular