如何绘制具有多个数据但只有2个标签的折线图？

Question

所以，

我一直在使用ng2-charts，因此我可以在我的角度应用程序中使用chartjs库来创建组件，我想绘制一个仅显示第一个和最后一个标签和点的图表，以便该图表易于阅读和干净。

如何显示第一个和最后一个？

或仅最后一个

Answer 1

在Chart.js中，标签可以作为数组提供。

示例

component.html

<canvas baseChart width="400" height="400"
                    [datasets]="lineChartData"
                    [labels]="lineChartLabels"
                    chartType="line"></canvas>

component.ts

  public lineChartData: ChartDataSets[] = [
    { data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A' }
  ];
  public lineChartLabels: Label[] = ['January', '', '', '', '', '', 'July'];

根据您的要求，可以为标签设置空值，但第一个和最后一个除外。