我的代码正在使用Amcharts。我使用ajax post api调用。我已经为数据创建了变量,但我希望它为它创建一个循环。
我正在尝试进行数据操作,但我无法做到。我想创建一个循环,在其中循环迭代json对象并推送到数组,然后将该数组提供给datatprovider来绘制图形
请检查我的代码,然后通知我,或者我可以通过其他任何方式实现。
这是我的代码:
var slot1 = [], Dride = [], Pride = [];
var object = {
"driver_data": [{
"slot": 0,
"rideCount": 98
}, {
"slot": 30,
"rideCount": 75
}, {
"slot": 100,
"rideCount": 0
}],
"passenger_data": [{
"slot": 0,
"rideCount": 33
}, {
"slot": 30,
"rideCount": 56
}, {
"slot": 100,
"rideCount": 37
}]
}
object.driver_data.forEach(function(key) {
slot1.push(key.slot);
Pride.push(key.rideCount)
});
object.passenger_data.forEach(function(key) {
slot1.push(key.slot);
Dride.push(key.rideCount);
});
var myObj = {}, myObj1 = {}, myObj2 = {}, arr = [];
myObj["slot"] = slot1[0];
myObj["passenger_data"] = Pride[0];
myObj["driver_data"] = Dride[0];
myObj1["slot"] = slot1[1];
myObj1["passenger_data"] = Pride[1];
myObj1["driver_data"] = Dride[1];
myObj2["slot"] = slot1[2];
myObj2["passenger_data"] = Pride[2];
myObj2["driver_data"] = Dride[2];
arr.push(myObj, myObj1, myObj2)
console.log(JSON.stringify(arr))
AmCharts.makeChart("chartdiv", {
"type": "serial",
"fixedColumnWidth": '10px',
"dataProvider": arr,
"hideCredits": true,
legend: {
horizontalGap: 10,
maxColumns: 1,
position: "right",
useGraphSettings: true,
markerSize: 10,
position: "top"
},
valueAxes: [{
gridColor: "#FFFFFF",
gridAlpha: 0.2,
dashLength: 0
}],
gridAboveGraphs: true,
startDuration: 1,
valueAxes: [{
stackType: "regular",
axisAlpha: 0.3,
gridAlpha: 0,
minimum: 0,
maximum: 100,
gridCount: 1
}],
graphs: [{
balloonText: "<b>[[title]]</b><br><span style='font-size:14px'>[[category]]: <b>[[value]]</b></span>",
fillColors: "#47b012",
lineColor: "#47b012",
fillAlphas: 0.8,
labelText: "[[value]]",
lineAlpha: 0.3,
title: "Driver",
type: "column",
color: "#000000",
valueField: "driver_data",
fixedColumnWidth: 25
},
{
balloonText: "<b>[[title]]</b><br><span style='font-size:14px'>[[category]]: <b>[[value]]</b></span>",
fillColors: "#fff138",
lineColor: "#fff138",
fillAlphas: 0.8,
labelText: "[[value]]",
lineAlpha: 0.3,
title: "Passenger",
type: "column",
color: "#000000",
valueField: "passenger_data",
fixedColumnWidth: 25
}
],
chartCursor: {
categoryBalloonEnabled: false,
cursorAlpha: 0,
zoomable: true
},
categoryField: "slot",
categoryAxis: {
gridPosition: "start",
gridAlpha: 0,
tickPosition: "start",
tickLength: 20,
labelRotation: 80,
labelFunction: function(valueText, dataItem, categoryAxis) {
if (valueText.length < 3) {
return valueText;
} else {
return valueText.replace(/(00|30)$/, ":$1");
}
}
}
});