CODEWITHSUNDEEP
javascriptajaxjsonhighcharts
Farshid Shekari
Farshid Shekari

Reputation: 2449

Set 2d json to highcharts

I use highcharts for draw charts. I have 2d json object and I don't know how to set this object to highcharts. And this is my json object data:
enter image description here

And I want my chart like this picture(column-parsed example of highchart):
enter image description here

And this is my code:

$.ajax({
                                url:"../../teachersem",
                                type:"get",
                                data:{
                                    id:$.trim(tableData[0])
                                },
                                success:function(data){

                                        $('div[class|="col-md-7 col-md-offset-3"]').css("display","none");
                                        //console.log(data.accept);
                                        //console.log(data.fail);
                                        var accept=new Array();
                                        var fail  =new Array();
                                        for (i = 0; i < data.accept.length; i++){
                                            accept.push([data.accept[i].year, parseInt(data.accept[i].count)]);
                                            alert("accept: "+data.accept[i].year+" "+parseInt(data.accept[i].count));
                                        }
                                        //console.log(accept.toString());
                                        for (i = 0; i < data.fail.length; i++){
                                            fail.push([data.fail[i].year, parseInt(data.fail[i].count)]);
                                            alert("fail: "+data.fail[i].year+" "+parseInt(data.fail[i].count));
                                        }
                                        $('#container').highcharts({
                                            chart: {
                                                type: "column"
                                            },
                                            title: {
                                                text: "Student data"
                                            },
                                            xAxis: {
                                                allowDecimals: false,
                                                title: {
                                                    text: "Branch of studies"
                                                }
                                            },
                                            yAxis: {
                                                title: {
                                                    text: "Number of students"
                                                }
                                            },
                                            series: [{
                                                data: [accept,fail]
                                            }],

                                        }); 

                                },
                                error:
                                    alert('error!')
                            })
                        });

But this has any result? please help,thank u!

Upvotes: 0

Views: 145

Answers (1)

alacy
alacy

Reputation: 5074

You actually want two series: data parameters (one for each column).

The first column will be the accept data and the second column will be your fail data since I am guessing that your category label which in the example image is Apples will be a Branch of Studies.

Your series should look something similar to the following:

series: [{
      name: "Accept",
      data: accept,
},
{
      name: "Fail",
      data: fail,
}]

Your accept and fail arrays are currently arrays of arrays, but they can actually be a simple list as seen in the Highcharts demo here. You can then specify in the xAxis parameter the categories: that are your Branch of Studies.

Upvotes: 2

Related Questions