☰Read-only archive⌕
Looking for help with Bokeh?

This is a read-only archive. Ask questions and join the conversation on GitHub.

Visit Community Support on GitHub →
Archived discussions · Captured October 28, 2026

Bokeh Python callback with components

Community Support
Juliano_Franz
Juliano_Franz

Hey Folks, I’ve asked this on Stackoverflow but I think here is best :slight_smile:

So, I am not a Web person so forgive-me if this is trivial.
I am trying to create a visualization using bokeh. I am using a custom Jijna template without the default {{ plot_div|indent(8) }} as I have my own schema:

<!-- *CustomCSS -->
    <style>
    {% include 'plots.css' %}
    </style>

<!-- Bokeh -->
    {{ bokeh_css }}
    {{ bokeh_js }}

    {{ bokehPlotsScript | safe }}
    {{ bokehSidebarScript |  safe}}

    <title>{{title}}</title>
    <title>Annelida Viewer</title>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-md-2">{{sidebar | safe}}</div>
            <div class="col-md-10">{{bokehPlots | safe}}</div>
        </div>
    </div>  
</body>
</html>

``

I add the plots to the template using components:

plotScripts, plotsDiv = createBokehPlot(df)
templateElements = dict(bokehPlotsScript=plotScripts, bokehSidebarScript=sidebarScripts, sidebar = sidebarDiv, bokehPlots = plotsDiv)
curdoc().template_variables.update(templateElements)

``

where createBokehPlot returns a layout with the figure. The sidebar is created in the same manner.

The problem that I have is that by doing this the callbacks from the buttons on the sidebar are not called on the bokeh server side. I think that I have to add my elements to the document with add_root() but I am not sure exactly how. Any suggestions?

Cheers

⌁   Link to post
Bryan
Bryan

Hi,

The components function only support standalone documents, not Bokeh server apps. For apps, you can use autoload_server, or iframe the app URL in your template. Currently this means apps can only be in "one piece". The ability to separately template different parts of an app in different locations on the page is an open feature request:

  https://github.com/bokeh/bokeh/issues/4986

I can imagine some possible "workarounds" that are clunky/hacky (e.g. put in an HTML button with a JS callback that updates some bokeh object to communicate with the Bokeh server app in a roundabout way) but I'm not sure I'd advise them.

Thanks,

Bryan

···

On Feb 11, 2017, at 06:59, jufranz@gmail.com wrote:

Hey Folks, I've asked this on Stackoverflow but I think here is best :slight_smile:

So, I am not a Web person so forgive-me if this is trivial. I am trying to create a visualization using bokeh. I am using a custom Jijna template without the default {{ plot_div|indent(8) }} as I have my own schema:

<!-- *CustomCSS -->
    <style>
    {% include 'plots.css' %}
    </style>

<!-- Bokeh -->
    {{ bokeh_css }}
    {{ bokeh_js }}

    {{ bokehPlotsScript | safe }}
    {{ bokehSidebarScript | safe}}

    <title>{{title}}</title>
    <title>Annelida Viewer</title>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-md-2">{{sidebar | safe}}</div>
            <div class="col-md-10">{{bokehPlots | safe}}</div>
        </div>
    </div>
</body>
</html>

I add the plots to the template using components:
plotScripts, plotsDiv = createBokehPlot(df)
templateElements = dict(bokehPlotsScript=plotScripts, bokehSidebarScript=sidebarScripts, sidebar = sidebarDiv, bokehPlots = plotsDiv)
curdoc().template_variables.update(templateElements)

where createBokehPlot returns a layout with the figure. The sidebar is created in the same manner.

The problem that I have is that by doing this the callbacks from the buttons on the sidebar are not called on the bokeh server side. I think that I have to add my elements to the document with add_root() but I am not sure exactly how. Any suggestions?

Cheers

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+unsubscribe@continuum.io.
To post to this group, send email to bokeh@continuum.io.
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/1e2b64d1-445d-4dd4-b560-5fb1a2f1934b%40continuum.io\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

⌁   Link to post

End of archived discussion · Replies are disabled