Ng2-charts: Stacked charts

[hggeorgiev]

Is it possible to create a stacked bar chart?

[bialad]

I had this issue as well, but managed to figure it out. It's even in the README. :)

Properties

• ...
• options (?any) - chart options (as from Chart.js documentation)

So you can customize these charts according to the chart.js documentation by using the options binding. You get a stacked bar chart by putting this scales object in the options object that's bound to the view:

options = {
  scales: {
    xAxes: [{
      stacked: true
    }],
    yAxes: [{
      stacked: true
    }]
  }
};

[hggeorgiev]

Thanks!

[Hongbo-Miao]

thanks @bialad for help!

[Epicnessism]

I just wanted to further clarify for those that were initially confused like me while trying to use the template examples provided by ng2Charts. To use the options solution provided by @bialad you need to use it like so in your graph component:

export class BtvBarGraphComponent implements OnInit { public barChartOptions: any = { scaleShowVerticalLines: false, responsive: true, scales: { xAxes: [{ stacked: true }], yAxes: [{ stacked: true }] } }; }