Highcharts - load json data

Question

I am working on a new project and using highchart for chart creation . I created a json file with some data from database:

[{"date": "2012-02-23", "number": 2}, {"date": "2012-02-21", "number": 4]

How do i can add this data to Highcharts->Chart->Series->Data ?

Answer 1

Find the code below. This displays the column chart for the data present in the JSON.

 <html>
    <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
    <script src="http://code.highcharts.com/highcharts.js" type="text/javascript"></script>
    <script type="text/javascript">
    jQuery(document).ready(function(){
            var data=[{"date": "2012-02-23", "number": 2}, {"date": "2012-02-21", "number": 4}];
            var chart = new Highcharts.Chart(
              {
                chart:{
                    renderTo: "container", // the div id where you want to dispaly the chart
                    type: 'column',        // type of chart as colum chart, it can be anything-'bar','pie','column' etc.
                    height: 300
                },
                title: {
                    text: "Numbers on two different dates"
                },
                xAxis: {
                    categories: [data[0]["date"],data[1]["date"]]
                },
                yAxis: {
                    title: {
                        text: 'Numbers on date'
                    }
                },
                series: [{name:"numbers",data:[data[0]["number"],data[1]["number"]]}]
            }  
        );          
    });
    </script>
    </head>
    <body>
    <div id="container">
    </div>
    </body>
    </html>

Highcharts - load json data

Question

1 answers

solution1
1 ACCPTED 2012-02-23 11:56:51

Highcharts - load json data

Question

1 answers

solution1 1 ACCPTED 2012-02-23 11:56:51

solution1
1 ACCPTED 2012-02-23 11:56:51