CODEWITHSUNDEEP
pythoncssjinja2bokeh
Amit Mantri
Amit Mantri

Reputation: 11

Bokeh integration with CSS and jinja

I have a bokeh dashboard which needs some custom styling(CSS).
I'm relatively new to the bokeh library and from what I understand, I need to use a jinja2 template wherein I can specify the CSS.

The dashboard has a 4 level hierarchy and the lower level plots only show up on selection at the level above. The hierarchy is as follows-

  1. Dropdown(widget) - This is the only thing shown on first load
  2. Plot 1(shows/updates on change of dropdown)
  3. Plot 2 (shows/updates on selection in plot 1)
  4. Plot 3 (shows/updates on selection in plot 2)

My index.html looks something like:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Sales Performance Analysis</title>
    <link *CDN Links*>
    <script *CDN Links*</script>
    {{ script }}
</head>
<body class="bk-body">
    <h1>Sales Performance Analysis</h1>
    {{ div }}
</body>
</html>

In my main.py, I have the following lines of code at the end to render-

script, div_plot = components(curdoc())
curdoc().template_variables["script"] = script
curdoc().template_variables["div"] = div_plot

When I execute this as a server app (bokeh serve --show folder_name), the browser application shows the dropdown widget but nothing happens on changing the values.

The same thing runs perfectly when run in standalone mode as bokeh serve --show main.py

Would appreciate any kind of pointers. TIA

Upvotes: 1

Views: 2680

Answers (1)

Luke Canavan
Luke Canavan

Reputation: 2137

You want to use bokeh.embed.server_session instead of bokeh.embed.components (which only statically embed the document)

Here's the reference:

https://docs.bokeh.org/en/latest/docs/user_guide/embed.html#bokeh-applications

Upvotes: 3

Related Questions