I have a bokeh page that requires a few seconds to load, and I’d like to display a loading animation until the page is ready to go. I’m running my apps behind Flask, and right now I have a CSS animation baked into the template files. I’m looking for a hook that will run a javascript snippet when bokeh starts to populate the document with plots, widgets, etc, so that I can turn my animation off.
Registering my snippet with document.onload makes it run way before the bokeh ui elements appear… so quickly that my animation doesn’t even show up.
Hacking an onload = ... line into the script returned by autoload_server() unfortunately has a similar effect – it runs when the script is loaded, not when it is finished running.
One possibility would be to have a callback on the server side, but as far as I can tell, the only way to propagate info to the browser would be through a model. So I could have a data source with an associated javascript onchange callback to remove the animation, and have the server put some dummy data in the data source. I’m not sure if the timing of this would work, and it also seems very messy.
I’m not familiar with the internals of Bokeh’s rendering process, but it seems like the solution to my problem is to hook into that somehow. Forgive my ignorance, but it seems like there could be something like: curdoc().add_callback("render", function) – does it exist? If not, could it be created without too much trouble? I’d be happy to do the leg work for a PR, but I suspect it would have to be done in coffeescript, and I don’t know coffeescript (I barely know javascript).
I realize I’m being a little loose with my terms – I’m not too picky if I can run my code after, during, or just before elements appear on the page. I’m also not much of a front-end programmer, so apologies for any incorrect terminology.
Thank you! Bokeh is a wonderful tool and I am grateful for the hard work contributors have put in, and for the excellent community support.