I have JSON string array in the following format:
{
[
{
"BillingMonth":"11",
"BillingYear":"2016",
"Volume":"72",
"BillingMonthName":"November",
"BillingProduct":"Product1"
},
{
"BillingMonth":"11",
"BillingYear":"2016",
"Volume":"617",
"BillingMonthName":"November",
"BillingProduct":"Product2"
},
{
"BillingMonth":"11",
"BillingYear":"2016",
"Volume":"50",
"BillingMonthName":"November",
"BillingProduct":"Product3"
},
{
"BillingMonth":"11",
"BillingYear":"2016",
"Volume":"617",
"BillingMonthName":"November",
"BillingProduct":"Product4"
},
{
"BillingMonth":"12",
"BillingYear":"2016",
"Volume":"72",
"BillingMonthName":"December",
"BillingProduct":"Product1"
},
{
"BillingMonth":"12",
"BillingYear":"2016",
"Volume":"72",
"BillingMonthName":"December",
"BillingProduct":"Product2"
},
{
"BillingMonth":"12",
"BillingYear":"2016",
"Volume":"72",
"BillingMonthName":"December",
"BillingProduct":"Product3"
},
{
"BillingMonth":"12",
"BillingYear":"2016",
"Volume":"72",
"BillingMonthName":"December",
"BillingProduct":"Product4"
}
]
}
There Are diffrent products(Product1,Product2,Product3,Product4) sold in months of november and december each.
I have to create one stackcolumn chart or stackedBar chart in canvas js with legends carrying products name.
I want to prepare four diffrent datapoints array to assign to display one column for each month november and december with diffrent products in diffrent colour holding in one column dynamically.
Please help me to write javascript to achieve the scenario.
Thanks!!!
What I have tried:
Result = JSON.parse(Result.d);
var dataPoints = [];
var dataPointsnew = [];
var dataPointsNew1 = [];
var dataPointsNew2 = [];
for (var i = 0; i <= Result.length - 1; i++) {
var series = new Array(dataPoints.push({ x: Result[i].BillingMonthName + '-' + Result[i].BillingYear, y: Result[i].Volume }));
}
dataPointsnew = dataPoints.chunk(8);
dataPointsNew1 = dataPointsnew[0][1];
dataPointsNew2 = dataPointsnew[1];