我有这个JSON,并希望保留每个糖果的类型和颜色的运行选项卡,并使用zingcharts将其显示在饼图中。
[
{
"name": "Dog",
"color": "Blue"
},
{
"name": "Dog",
"color": "Blue"
},
{
"name": "Cat",
"color": "Yellow"
}
我的JSON来自HTTP get请求。我似乎无法让我的图表识别blueDog
和yellowCat
的整数值。我是否正确检查每个属性的值?
我尝试按照example进行操作,但没有取得预期效果。
var sortedAnimals= [];
var blueDog = 0;
var yellowCat = 0;
$http.get('/sorted-animals').then(function (response) {
$scope.sortedAnimals= response.data;
for (var i = 0; i < sortedAnimals.length; i++) {
sortedAnimals[i] = sortedAnimals[i];
if (sortedAnimals[i].name == "dog" && sortedAnimals[i].color == "blue") {
blueDog++;
}
if (sortedAnimals[i].name == "cat" && sortedAnimals[i].color == "yellow") {
yellowCat++;
}
}
$scope.myJson = {
type: "pie",
title: {
textAlign: 'center',
text: "My title"
},
plot: {
slice: 50 //to make a donut
},
series: [{
values: [blueDog]
},
series: [{
values: [yellowCat]
}]
};
},
function (error) {
console.log(error);
});
答案 0 :(得分:2)
查看你的for循环 -
for (var i = 0; i < sortedAnimals.length; i++) {
sortedAnimals[i] = sortedAnimals[i];
if (sortedAnimals[i].name == "dog" && sortedAnimals[i].color == "blue") {
blueDog++;
}
if (sortedAnimals[i].name == "cat" && sortedAnimals[i].color == "yellow") {
yellowCat++;
}
}
应该是
for (var i = 0; i < $scope.sortedAnimals.length; i++) {
//I got rid of an unnecessary line here
if ($scope.sortedAnimals[i].name == "dog" && $scope.sortedAnimals[i].color == "blue") {
blueDog++;
}
if ($scope.sortedAnimals[i].name == "cat" && $scope.sortedAnimals[i].color == "yellow") {
yellowCat++;
}
}
你基本上只是放弃了$ scope,但需要保留它。
如果您希望sortedAnimals
不在$ scope上,则需要指定为:
var sortedAnimals = $scope.sortedAnimals
答案 1 :(得分:1)
尝试将sortedAnimals
更改为$scope.sortedAnimals
:
$scope.sortedAnimals = response.data;
for (var i = 0; i < $scope.sortedAnimals.length; i++) {
if ($scope.sortedAnimals[i].name == "dog" && $scope.sortedAnimals[i].color == "blue") {
blueDog++;
}
if ($scope.sortedAnimals[i].name == "cat" && $scope.sortedAnimals[i].color == "yellow") {
yellowCat++;
}
}