html - 如何让 ng2-charts 中折线图的线条成为直线？

我正在使用 ng2-charts 在我的 Angular 8 应用程序中制作折线图。但是，折线图显示为曲线而不是直线。我正在参考以下链接中的代码 https://valor-software.com/ng2-charts/#/LineChart，你可以看到，折线不是直的。如何让它们显示为直线？

谢谢。

答案＃1

像这样在选项中传入 bezierCurve: false：

<canvas baseChart width="400" height="400"
            [datasets]="lineChartData"
            [labels]="lineChartLabels"
            [options]="{bezierCurve: false}">
</canvas>

或者如果你使用更新的版本 lineTension: 0:

<canvas baseChart width="400" height="400"
            [datasets]="lineChartData"
            [labels]="lineChartLabels"
            [options]="{lineTension: 0}">
</canvas>

或者如果你想影响某个特定的数据集：

<canvas baseChart width="400" height="400"
            [datasets]="{data: data, lineTension: 0}"
            [labels]="lineChartLabels"
            [options]="lineChartOptions">
</canvas>

与原作者无关的问题：

我注意到默认情况下折线图下方区域是有颜色的，我尝试了 background-color:'none'; 但不起作用，它只是显示灰色背景。有没有办法让折线下方没有任何颜色？

<canvas baseChart width="400" height="400"
            [datasets]="{data: data, lineTension: 0, fill: false}"
            [labels]="lineChartLabels"
            [options]="lineChartOptions">
</canvas>

[datasets]="{fill: false}"

答案＃2

ng2-chart 的新版本是这样的：

Javascript 代码：

 public lineChartOptions: ChartConfiguration['options'] = {
    elements: {
      line: {
        tension: 0
      }
    }
}

HTML 代码：

 <canvas baseChart 
                  [data]="lineChartData"
                  [options]="lineChartOptions">
 </canvas>