Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/backbone.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
使用google图表处理javascript对象_Javascript_Google Visualization - Fatal编程技术网

使用google图表处理javascript对象

使用google图表处理javascript对象,javascript,google-visualization,Javascript,Google Visualization,我正试图绘制一个基于以下JSON的谷歌可视化饼图。我遇到了一些问题,因为谷歌使用数字数据,而不仅仅是普通对象 例如,我想要一个基于用例的饼图。饼图将列出VDI、升级、演示,并显示其占总数的比例。请帮忙 下面是JSON示例 [{Id:0,处理时间:2012/01,批准人:zoo,POC:POC1,用例:VDI},{Id:0,处理时间:2012/02,批准人:zoo,POC:POC1,用例:Upgrade},{Id:0,处理时间:2012/03,批准人:zoo,POC:POC2,用例:DEMO},{

我正试图绘制一个基于以下JSON的谷歌可视化饼图。我遇到了一些问题,因为谷歌使用数字数据,而不仅仅是普通对象

例如,我想要一个基于用例的饼图。饼图将列出VDI、升级、演示,并显示其占总数的比例。请帮忙

下面是JSON示例 [{Id:0,处理时间:2012/01,批准人:zoo,POC:POC1,用例:VDI},{Id:0,处理时间:2012/02,批准人:zoo,POC:POC1,用例:Upgrade},{Id:0,处理时间:2012/03,批准人:zoo,POC:POC2,用例:DEMO},{Id:0,处理时间:2012/04,批准人:victor,POC:POC2,用例:DEMO},{Id:0,处理时间:2012/05,批准人:victor,POC3,用例:DEMO},{Id:0,处理时间:2012/06,批准人:victor,POC:POC3,用例:升级},{Id:0,处理时间:2012/05,批准人:tom,POC:POC3,用例:VDI},{Id:0,处理时间:2012/06,批准人:tom,POC:POC3,用例:升级}]

// Full source
google.setOnLoadCallback(drawChart);

function drawChart() {
    $.get('/Home/GetData', {},
function (data) {
var tdata = new google.visualization.DataTable();

tdata.addColumn('string', 'UseCase');
tdata.addColumn('int', 'Count');


// Reservation based on UseCase
var ReservationByUseCase = [];
for (var i = 0; i < data.length; i++) {
    var d = data[i];

    // If not part of array.. Add it
    if ($.inArray(d.UseCase, ReservationByUseCase) === -1)
    {
        var UseCaseValue = d.UseCase;
        var UseCaseCountValue = 1;
        ReservationByUseCase.push({ UseCase: UseCaseValue, UseCaseCount: UseCaseCountValue });
    }

    // If part of the array.. Increase count
    if ($.inArray(d.UseCase, ReservationByUseCase) !== -1) {
        var cUseCase = ReservationByUseCase[$.inArray(d.UseCase, ReservationByUseCase)];
        cUseCase.UseCaseCount = cUseCase.UseCaseCount + 1;

        ReservationByUseCase[$.inArray(d.UseCase, ReservationByUseCase)] = cUseCase
    }

}

for (var i = 0; i < ReservationByUseCase.length; i++) {
    tdata.addColumn(ReservationByUseCase[i].UseCaseValue, ReservationByUseCase[i].UseCaseCountValue)
    alert(ReservationByUseCase[i].UseCaseValue);
    alert(ReservationByUseCase[i].UseCaseCountValue);
}

var options = {
    title: "Reservations"
};

var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(tdata, options);
});
}

您只需循环浏览数据并将每个用例相加:

var ndata = {}

var data = [{"Id":0,"ProcessedTime":"2012/01","Approver":"zoo","POC":"POC1","UseCase":"VDI"},{"Id":0,"ProcessedTime":"2012/02","Approver":"zoo","POC":"POC1","UseCase":"Upgrade"},{"Id":0,"ProcessedTime":"2012/03","Approver":"zoo","POC":"POC2","UseCase":"DEMO"},{"Id":0,"ProcessedTime":"2012/04","Approver":"victor","POC":"POC2","UseCase":"DEMO"},{"Id":0,"ProcessedTime":"2012/05","Approver":"victor","POC":"POC3","UseCase":"VDI"},{"Id":0,"ProcessedTime":"2012/06","Approver":"victor","POC":"POC3","UseCase":"Upgrade"},{"Id":0,"ProcessedTime":"2012/05","Approver":"tom","POC":"POC3","UseCase":"VDI"},{"Id":0,"ProcessedTime":"2012/06","Approver":"tom","POC":"POC3","UseCase":"Upgrade"}];

for (i = 0; i < data.length; i++) {
    var d = data[i];
    if (ndata[d["UseCase"]] == null) {
      ndata[d["UseCase"]] = 1
    } else {
      ndata[d["UseCase"]] = ndata[d["UseCase"]] + 1
    }
}

console.log(ndata);

这里有一把小提琴:

这就是我想到的……这有用吗

// Reservation based on UseCase
var ReservationByUseCase = [];
for (var i = 0; i < data.length; i++) {
    var d = data[i];

    // If not part of array.. Add it
    if ($.inArray(d.UseCase, ReservationByUseCase) === -1)
    {
        var UseCaseValue = d.UseCase;
        var UseCaseCountValue = 1;
        ReservationByUseCase.push({ UseCase: UseCaseValue, UseCaseCount: UseCaseCountValue });
    }

    // If part of the array.. Increase count
    if ($.inArray(d.UseCase, ReservationByUseCase) !== -1) {
        var cUseCase = ReservationByUseCase[$.inArray(d.UseCase, ReservationByUseCase)];
        cUseCase.UseCaseCount = cUseCase.UseCaseCount + 1;

        ReservationByUseCase[$.inArray(d.UseCase, ReservationByUseCase)] = cUseCase
    }

}

谢谢你的帮助!我想这已经接近解决我的问题了。这是你能以更可读的格式给我这一行的方式吗?我有C语言的经验,但对javascript不熟悉。ndata[d[UseCase]]=ndata[d[UseCase]]==null?1:ndata[d[UseCase]]+1;当然,它只是说:如果这是真的?分配这个:否则分配这个谢谢你重写上面的代码。这很有帮助。我确实对这行有疑问。这是在检查ndata数组中是否存在d.usecase吗?非常感谢。。我对这种语法不是很熟悉。我想我回到了第一步。我发布了完整的源代码。请帮助。