How to build tree diagrams in bokeh

Question

What would it take to implement a tree diagram in bokeh? Something similar to this DS example would be nice --

http://bl.ocks.org/robschmuecker/7880033

I'm just looking to visualize a data structure, so only need the pan, zoom, and collapse functionality.

Thanks! - AH

Answer 1

There is nothing in Bokeh to do this automatically. Bokeh does now support network/graph support, which it did not at the time the question was originally posted:

https://docs.bokeh.org/en/latest/docs/user_guide/graph.html

However, it would take some work to use this to reproduce the link above:

• non straight-line edges would need to be computed explicitly
• nodes/edges would have to be hidden manually based on TapTool events

Additionally there is no "smooth animation" option yet (as of Bokeh 0.13.0) so the transitions would be instant.

If the idea is to have this sort of capability along side other Bokeh plots, or to connect it to Python backend code, then another option is to write a custom extension for Bokeh:

https://docs.bokeh.org/en/latest/docs/user_guide/extensions.html

This would take some up-front work, but doing this, you could integrate the fancy D3 widget directly into Bokeh documents, and use it like, and connect it to, any other Bokeh component or widget.