Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to use PrimeNg Chart of Width and Height?

How can i use width and height for PrimeNg Chart?

 <p-chart type="bar" width="400" height="400" [data]="data"></p-chart>

There is no effect when i use width and height.Please let me know how to use Chart of width and height.

like image 779
Thu Rein Avatar asked Nov 21 '16 09:11

Thu Rein


2 Answers

https://www.reddit.com/r/webdev/comments/4gjuvp/chartjs_canvas_height_width_ignored/

According to that link you have to set two options for the chart:

<p-chart type="bar" width="400" height="400" [data]="data" [options]="options"></p-chart>

And in your Typescript Code:

options = {
  responsive: false,
  maintainAspectRatio: false
};
like image 162
Benedikt Avatar answered Sep 28 '22 19:09

Benedikt


Looking over the source code, p-chart takes width and height as component inputs, so putting them in [] should do the trick:

<p-chart type="bar" [width]="400" [height]="400" [data]="data"></p-chart>
like image 34
Jens Habegger Avatar answered Sep 28 '22 18:09

Jens Habegger