Hi,
Requirement:How to Bind Series Dynamically?
I am working with charts ,kindly let me knoe hot to loop in it to fill data acordingly
My code ( as below code is not working with loop , if I remove loop it works fine with static data)
if (response.d.length > 0) {
for (var count = 0; count < response.d.length; count++) {
new Vue({
el: '#app',
components: {
apexchart: VueApexCharts,
},
new Vue({
el: '#app',
components: {
apexchart: VueApexCharts,
},
data: {
series: [{
name: response.d[count].DepartName,
// data: [response.d[count].approveddocs, response.d[count].rejecteddocs, response.d[count].DepartName]
data: [42, 100]
name: response.d[count].DepartName,
// data: [response.d[count].approveddocs, response.d[count].rejecteddocs, response.d[count].DepartName]
data: [42, 100]
}],
chartOptions: {
chart: {
type: 'bar',
height: 350,
stacked: true,
toolbar: {
show: true
},
zoom: {
enabled: true
}
},
responsive: [{
breakpoint: 480,
options: {
legend: {
nbsp; offsetX: -10,
offsetY: 0
}
}
}],
plotOptions: {
bar: {
horizontal: false,
},
},
xaxis: {
type: 'datetime',
categories: ['01/01/2011 GMT', '01/02/2011 GMT', '01/03/2011 GMT', '01/04/2011 GMT',
'01/05/2011 GMT', '01/06/2011 GMT'
],
},
legend: {
nbsp; offsetY: 40
},
fill: {
opacity: 1
}
},
chart: {
type: 'bar',
height: 350,
stacked: true,
toolbar: {
show: true
},
zoom: {
enabled: true
}
},
responsive: [{
breakpoint: 480,
options: {
legend: {
nbsp; offsetX: -10,
offsetY: 0
}
}
}],
plotOptions: {
bar: {
horizontal: false,
},
},
xaxis: {
type: 'datetime',
categories: ['01/01/2011 GMT', '01/02/2011 GMT', '01/03/2011 GMT', '01/04/2011 GMT',
'01/05/2011 GMT', '01/06/2011 GMT'
],
},
legend: {
nbsp; offsetY: 40
},
fill: {
opacity: 1
}
},
},
})
}
Kindly guide me
Thanks