Showing a waiting image while jquery ajax request for plot data is being performed

In my js file, flot plugin draws line chart in div chart:

$.plot($("#chart"), [ oneday ]);

[oneday] is callled by another js file.

var oneday = [[8, 5],[12, 9],[16, 1]];
var oneweek = [[1, 5],[2, 9],[3, 1],[4, 5],[5, 9],[6, 1],[7, 11]];
var onemonth = [[1, 5], [3, 8], [5, 18], [7, 10], [开发者_JS百科9, 4], [11, 2], [13, 15], [15, 9],[30, 1]];

how can I use ajax to pass oneday's value? I want to use a waiting image when it's drawing the chart, starting when the ajax call starts and removing the image when it is complete.

Thanks!

Have a look at http://people.iola.dk/olau/flot/examples/ajax.html. You can use something like

function refreshPlot(dataurl) {
    drawLoadingImageOnPlaceholder(placeholderDiv);

    function onDataReceived(data) {
        removeLoadingImageFromPlaceholder(placeholderDiv);
        $.plot(placeholderDiv, data, plotOptions);
    }

    $.ajax({
        url: dataurl,
        method: 'GET',
        dataType: 'json',
        success: onDataReceived
    });
}

Where dataurl is the URL of your jsonified data-to-load. drawLoadingImage() and removeLoadingImage() would show and hide a superimposed 'div' with a placeholder image on top of the plot.