plotting JSON data using jqPlot

Question

I'm trying to plot some JSON Data using the jqPlot library within an HTML 5 app powered by jqMobile. I'm placing the following code within the 'body' of the html page. Is there something I'm missing here?

<script>    
$(document).ready(function() {
    // get the JSON data from server
    $.getJSON("myspecialurl", function(data) {
        success: function(data) {
            plotData(data);
        }
    });
    // plot the data
    function plotData(data) {
        ds = [];
        $(data).find('latitude').each(function() {
            ds.push([$(this).attr('answer'), parseInt($(this).attr('count'))]);
        });
        $.jqplot('chart1', [ds], {
            seriesDefaults: {
                renderer: $.jqplot.DonutRenderer
            },
            legend: {
                show: true
            }
        });
    }
}    
</script>

Edit: New Plot Method

function plotData( data ) {
 // ds = [];
 // $(data).find('latitude').each( function() {
 //   ds.push( [ $(this).attr('answer'), parseInt( $(this).attr('count') ) ] );
 // } );
var array = data.contacts;


$.jqplot('chart1', array[0].latitude, {
seriesDefaults:{
   renderer:$.jqplot.DonutRenderer
},
legend: {show:true}
 });
}

At the fist glance it appears to be OK. How does the `JSON` looks like before your operations. Do you enter the `plotData()`? — Boro, Jun 21 '12 at 15:27
the console is throwing this error Uncaught SyntaxError: Unexpected token ( — Apollo, Jun 21 '12 at 15:37
I also get this error regarding data Exception: ReferenceError: data is not defined] — Apollo, Jun 21 '12 at 15:39
OK but at which point/step in your code? Plus show the JSON. — Boro, Jun 21 '12 at 15:39
http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=? is json url — Apollo, Jun 21 '12 at 15:41
@Boro between succes:function ( data ) and plotData( data ); it says that there is an Unexpected token ( — Apollo, Jun 21 '12 at 15:44
Put `console.log("OI");` inside the method called on `success` and let me know if it gets called. It is to big to see if there are some problems but if you will enter the `success` it would mean that `jQuery` parsed it all right. — Boro, Jun 21 '12 at 15:45

Boro · Answer 1 · 2012-06-21T16:08:29.550

1

Of coarse there is a problem and the computer is again right. This is how your code should look like. You were defining success as if you were using ajax method, with getJSON success is passed as the 2nd parameter.

$.getJSON("myspecialurl", function(data) {
    plotData(data);
});

EDIT I spot also that you are not closing the ready function appropriately. It should be }); rather than just }.

edited Jun 21 '12 at 16:08

answered Jun 21 '12 at 15:49

Boro

7,913
4
43
85

ahhh, ok yup that cleared up that error, however the console is now throwing this error Uncaught No plot target specified but yet I am specifying a plot... – Apollo Jun 21 '12 at 15:55
At which line is the reference exception thrown? – Boro Jun 21 '12 at 16:02
at line 1881 in jquery.jqplot.js file which makes me think that this code is fine, except that I can't access my data. when I try to access a certain piece of data it is held within an index, like 0,1,2,3. When I try to do data.contacts.0.name it does not like the number 0, even though I need that to access the JSON data bit. Is there a way around this? – Apollo Jun 21 '12 at 16:09
Please see the **EDIT**. I hope it wasn't me who removed the `ready` method's closing. – Boro Jun 21 '12 at 16:09
ok so I have edited my question so that it shows my lastest plot method, which is still showing "Uncaught No Plot target specified" error in console, however I now know that my data is there (I've been able to log in to the console). Am I not understanding something about jqPlot? – Apollo Jun 21 '12 at 16:16
AS it goes to `find` http://stackoverflow.com/a/4992429/613495 AS it goes to format of Donut chart http://www.jqplot.com/tests/pie-donut-charts.php Thus, something like this `[[['a',6], ['b',8], ['c',14], ['d',20]]]` should go it the place of `array[0].latitude` – Boro Jun 21 '12 at 16:21

plotting JSON data using jqPlot

1 Answers1

Linked