Behold, a live visualization of the active content on the various StackExchange communites.
I have dreamt about live data stream visualizations for a long time – but as a (mainly) Python programmer, the web scared me. That is why I usually rely on the old, lovable Matplotlib for my plots.
Well, have no fear my fellow Pythonistas – you can get your live data visualization all with just one file and no messing around with Heroku or Flask or whatnot.
Wanna do it yourself? Here’s the only file you need. I’ll explain a high level view of it below. But first, try saving it and opening it with your favorite webbrowser. Voila, your own personal live data visualization. Hell, throw it up on a free GitHub Pages repo, and now it’s on the web!
Okay but what’s going on here, and what’s this dark magic. I don’t see any Flask/Django, I didn’t have to struggle with Heroku. There’s gotta be a catch.
Maybe Python can solve all your problems, but it doesn’t mean it is the solution of minimal effort. Especially when it comes to the web.
A High-Level View
Here is the flow:
- Our server (in my case, Github Pages) sends the client the static html page
live_graph.html. That’s the only time the client ever needs to talk to our server.
- Whenever StackExchange publishs a new active question, it sends it to the client via the websocket in the form of a JSON object.
- Plotly responds with a new plot, which the client’s browser then renders in the current html page.