Как сделать линии в линейных диаграммах из ng2-диаграмм прямыми?

Question

Я использую ng2-диаграммы для построения линейных диаграмм в своем приложении Angular 8. Но линейные диаграммы отображаются в виде кривых, а не прямых линий. Я беру код по следующей ссылке https://valor-software.com/ng2-charts/# / LineChart , как видите, линии не прямые. Как сделать их прямыми?

Спасибо.

Answer 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>

Несвязанный вопрос от OP:

Я заметил, что по умолчанию область под линейным графиком имеет цвет, я пробовал background-color:'none';, но это не так не работает, и это просто положить серый цвет под ним. Есть ли способ, чтобы не было никакого цвета под линией?

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

[datasets]="{fill: false}"