SUNIL KUMAR E.U SUNIL KUMAR E.U - 5 months ago 16
AngularJS Question

Not getting $rootscope and $scope values inside angular-google-chart

I am trying to create 100% stacked column chart using ng-google chart
Please check below code

for(var i = 0; i < $scope.output[i].length; i++){
$rootScope.month= $scope.output[i].month;
$rootScope.male= $scope.output[i].genderM;
$rootScope.female= $scope.output[i].genderF;
**//line 1**
var a=$scope.output[i].genderM;

$scope.charts.data = {
"cols": [{
id: "month",
label: "Month",
type: "string"
}, {
id: "laptop-id",
label: "genderM",
type: 'number'
}, {
id: "desktop-id",
label: "genderF",
type: 'number'
}],
"rows": [{
c: [{
v: "jan"
}, {
v: $rootScope.male
**//line 2**
}, {
v: $rootScope.female,
f: "1 unit (Out of stock this month)"
}, {
v: 12,
f: "Ony 12 items"
}]
}]

}

console.log("xxxxxxxxxxxx",a)
console.log("yyyyyyyyyyyy",$scope.charts.data)
}


I am getting '$rootScope' and '$scope' values in line1 and i am not getting values in line2.Please help to solve this issue

Answer
var customer = [Array('Month', 'Male', 'Female')]; 
$scope.output.forEach(function(value){

    customer.push([value.month, value.genderM, value.genderF]);
})

var data = google.visualization.arrayToDataTable(customer);
var options = {
    isStacked: 'percent',
    width: 510,
    height: 300,

    legend: { position: 'top', maxLines: 11 },
    bar: { groupWidth: '75%' },
    vAxis: { gridlines: { count: 12 } }
  };
  var chart = new google.visualization.ColumnChart(document.getElementById("barchart_values"));
  chart.draw(data, options);
  //console.log("Customer gender",data);

}

Comments