How can I set the height of a chart with ng2-charts

angular ng2-charts
BrandonReid picture BrandonReid · Jul 20, 2016 · Viewed 26.3k times · Source

How do I set a chart's height using ng2-charts? I'm making a line chart, just like the demo on the ng2-charts site.

I've searched the documentation for ng2-charts and chart.js. In chart.js it looks like you set a height property on the canvas element like <canvas height="400">, but that element is obscured by the ng2-charts component.

Answer

BrandonReid picture BrandonReid · Jul 21, 2016

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.

Related questions

ng2-charts update labels and data

I'm trying to create dynamically a chart using ng2-chart, I get information from an angular 2 service, when I change only labels of chart it works and when I change data only it works, but When I change both just …

Read More
How do I change the color for ng2-charts?

I have added ng2-charts to my project and display 2 charts - donut & barchart. both are displayed in gray since I added <base-chart class="chart" [colors]="chartColors" ... </base-chart> to the component.template.html, and public chartColors:…

Read More
NG2-Charts Can't bind to 'datasets' since it isn't a known property of 'canvas'

I am trying to use the basic example of NG2-Charts (http://valor-software.com/ng2-charts/) I copy pasted the HTML part <div style="display: block"> <canvas baseChart [datasets]="barChartData" [labels]="barChartLabels" [options]="barChartOptions" [legend]="barChartLegend" [chartType]="…

Read More