Attach a finished drawing event to the Flotr or Flotr2

Question

I'm using the Flotr2 lib: https://github.com/HumbleSoftware/Flotr2

I have been searching everywhere to just understand how to add a callback or an event handler which gets triggered when the Flotr graph is actually finished with its drawing.

My graph draws okay with small or mid size data but when I use a larger set of data, the graph takes much longer to draw. While it's trying to draw, the graph container is blank so I would like to show a loading spinner while it's trying to draw and hide this spinner when the graph is actually finished with its drawing.

So my question is how to know when the graph has really completed its drawing?

Could someone please point me to the right direction or provide with some code sample. Any help would be much much appreciated.

Thank you,

Answer 1

You can wrap the call to Flotr.draw in another function, and just put your spinner code inside the calling function.

window.onload = function() {
    // show the spinner here

    Flotr.draw(
        document.getElementById("chart"),
        data,
        options
    );

    // hide the spinner here
}

I've used windows.onload as a wrapper, but you could also use a custom function that you call explicitly.