I'm trying to both embed a bokeh plot AND a bokeh datatable in a flask-generated website (same page) using some of the provided examples in the Bokeh docs. Both components work standalone. I tried to put them together via gridplot, but that seems only to work with plots, and a datatable is a 'widget'. I'm probably missing some very basic concept, but any pointers or links to examples are appreciated

  • There's also HBox/hplot and VBox/vplot – bigreddot Feb 9 '16 at 17:20
  • hplot and vplot: same contraints, but HBox/VBox worked, thank you! – BjoernL. Feb 10 '16 at 9:46

The way I like to do this is to use the full power of the embed.components method and pass in a dictionary of plot objects and then render them wherever I need in my html template.

I call components as follows:

from bokeh.embed import components
script, div_dict = components({"plot": plot, "table": table})

My div_dict looks like this:

# {"plot": plot_div, "table": table_div})

I then pass this dict and the script into my template context and use it something like this:

   {{ plot_div }}
   {{ table_div }}
   {{ script }}

Here's an example from the bokeh examples: https://github.com/bokeh/bokeh/blob/master/examples/embed/embed_multiple_responsive.py#L26

  • Very helpful, thank you! – BjoernL. Feb 15 '16 at 12:09
  • How does this work if you have 2 plots and a widget (where the plots plots are controlled by the same widget). I'm trying to exactly the above, but once I put them into separate components (so I can place anywhere in my HTML template) the relationship between the widgets and plots appears to break... – Hazzamataza Sep 30 '18 at 12:22
  • Are you using bokeh server or JS callbacks? – birdsarah Oct 1 '18 at 16:46

Your Answer

