jQuery + JSON + Open flash chart, how can I create a chart on the fly?

Question

The JS

SWFlocation = "open-flash-chart.swf";
getMyData = function()
{
    $.post(
     myJsURL, 
     {
      passedval: 1234
     }, 
     function (returned_json) {
      return returned_json;

     },
     "json"
    ); 
}
swfobject.embedSWF(SWFlocation, "myChartDiv", "650", "200", "9.0.0", "", {"get-data":"getMyData"} );

Using firebug, if I hardcode the returned JSON, the chart works fine. But when I request the data as above - i.e. after the page has loaded, I get a 2032 error.

The getMyData method actually requests data from a PHP script that in turn requests data from and extrnal API (a big one like flickr) so there can be a few seconds delay if the results are not currently cached by us. Maybe I'm going about this the wrong way?

Answer 1

Just a guess as I don't use Open Flash Chart but since you're making an async ajax call your getMyData function is not actually returning the json value (the callback function you defined is).

Try preloading (maybe make a synchronous ajax call before the swf embed?) the data and storing it in a var, then have your getMyData function simply return that var.

Answer 2

You have to put the swfobject.embedSWF() into the ajax callback.

like this:

SWFlocation = "open-flash-chart.swf";
init_chart = function()
{
    $.post(
        myJsURL, 
        {
                passedval: 1234
        }, 
        function (returned_json) {
                swfobject.embedSWF(SWFlocation, "myChartDiv", "650", "200", "9.0.0", "", {"get-data":returned_json} );    
        },
        "json"
    ); 
}
init_chart();