How can I set the height of a chart with ng2-charts
In the ts file, declare chartOptions as ::
chartOptions = {
responsive: true,
maintainAspectRatio: false,
}
Likewise, In html file property bind [options]="chartOptions" and set required height, width in div tag
<div style="display: block; width: 500px; height: 400px;">
<canvas
baseChart
[chartType]="'line'"
[datasets]="chartData"
[labels]="chartLabels"
[colors]="lineChartColors"
[options]="chartOptions"
[legend]="true"
(chartClick)="onChartClick($event)">
</canvas>
</div>
This will work.
Just set a height property of baseChart.
<canvas baseChart height="300" ...></canvas>
Figured it out.
If responsive: true
and maintainAspectRatio: false
settings are set, you can then set the css height property of the <base-chart>
element.