line jqx chart with json data

[atomicParticipant]

Hi guys,

I have small problem. I have very big json file.

{
    "H1": 36075.921875,
    "H2": 35573.53125,
    "H3": 35406.421875,
    "H4": 35267.37890625,
    "H5": 35266.16796875,
    "H6": 35776.8046875,
    "H7": 36590.5390625,
    "H8": 37355.44140625,
    "H9": 37174.3671875,
.....

‘H’ goes to 8760, so I have 8760 values and for different technologies and years, so a lot of data.
I want line chart which will have 8760 values on x-axis and their corresponding values on y.
I am not able to bind this json file to jqx chart without recreating this json in different format, which is no acceptable because it takes time.
Thank you very much.
Could you please advise me ho to bind this data to jqx line chart.

[ivailoParticipant]

Hi atomic,

You can easy convert your object to array of objects and to create standard line chart.
When you convert it to array of objects you can set different fields about valueAxis and categoryAxis.
Here is a demo.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[atomicParticipant]

Hi Ivailo,

Thank you for your reply.
Actually I wanted to avoid “for loop” since I have 8760 rows in it (performace issue)…
May be I will create appropriate json before actual plotting chart…

I have one small question. Since I am getting my json in dataAdapter, could you please help me coonvert it to array in LoadComple or shuold I use beforeLoadComplete…

       var myURL ='chart.json';
        var source =
        {
            url: myURL,
            datatype: 'json',
            cache: false,
            async: true,
        };   
        var dataAdapter = new $.jqx.dataAdapter(source, {
            autoBind: true,
             beforeLoadComplete: function(records) 
                {
                    var sampleData = [];                
                    var sampleLength =  Object(records).length;
                    for(var i=0; i<sampleLength; i++){
                    		j="H" + (i+1);
                    		var k = {};
                        k.a = records[j];
                        k.b = j;
                        sampleData.push(k);
                    }
                    return sampleData;             
                }
            });   

then I use SampleData as my source for jqxChart.

Thank you very much

[ivailoParticipant]

Hi atomic,

Use beforeLoadComplete, but instead records try to use records[0]. records is array of objects and your JSON is first one.
In the below example is used localdata, but you can set your url instead.

Here is the demo.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[atomicParticipant]

Ivailo thanks a lo for your help. Everything works great!!!

[Author]

Posts