I am using ng2-Charts on my project, I can able to create charts with fixed data sets(example: I can create chart with 3 lines). But I want to create a stacked bar chart, even I am able to create this chart, but I am failing on creating the datasets dynamically.
The Bars will dynamically change, one time there will be two bars(stacked), another time It will be 5 it is purely user-based.
I have tried the below code.
getChartdata(){
//datainfo is response coming from API
let data_arry:any =[];
let data_obj:any ={};
let time_period:any = ["sun", "mon", "the", "wed", "the", "fri", "sat"];
for(let key of datainfo){
data_obj['data'] = [1,2,3,4]
data_obj['stack'] = 'a';
data_obj['barPercentage'] = 0.5;
data_obj['barThickness'] = 30;
data_arry.push(data_obj)
}
this.StringChart(data_arry, time_period)
}
StringChart(data_arry:any, time_period:any) {
var Tooltip_options: any = {
maintainAspectRatio: false,
scales: {
yAxes: [{
barPercentage: 1.6,
gridLines: {
drawBorder: false,
color: 'rgba(29,140,248,0.0)',
zeroLineColor: "transparent",
},
}],
xAxes: [{
barPercentage: 1.6,
gridLines: {
drawBorder: false,
color: 'rgba(0,242,195,0.1)',
zeroLineColor: "transparent",
},
ticks: {
padding: 20,
fontColor: "#9e9e9e"
}
}]
}
};
this.LC_Data = data_arry;
this.LC_Labels = time_period;
this.LC_Options = Tooltip_options;
}
When I do console.log it is displaying an array of objects, but not able to see the Chart, I am getting the below error :
ERROR TypeError: labels.slice is not a function