Bokeh server callback initiated from Flask application

Question

I am building an application using the AppBuilder flash framework and have successfully autoload_server bokeh portion using autoload_server to insert the src script into my html template. At the moment, I have a widget button inside a bokeh application that launches a python callback to update the chart. What I would like to know is that you can trigger the same behavior, but with the help of a button that is located inside the flash application. It seems to me that this should be possible, but I just don’t know how to report the user interface event from the bulb button to the bokeh server.

The following is simplified code.

Bokeh.py code

Has a callback button to change the graph from "cos" to "sin".

 import numpy as np from bokeh.plotting import figure, output_file, show from bokeh.io import curdoc, reset_output from bokeh.layouts import column, row from bokeh.models import Button def plotRoutine(input): x = np.linspace(0,10) if input=='cos': y = np.cos(x) if input=='sin': y = np.sin(x) plot = figure(title = input) plot.line(x, y) return plot def callback(): plot = plotRoutine('sin') layout.children[1] = plot plot = plotRoutine('cos') button = Button(label="Callback button in bokeh server") button.on_click(callback) layout = column(button, plot) curdoc().add_root(layout) curdoc().title = "bokeh" 

Jar application

Embeds a bokeh application using a bokeh server. First, I run bokeh serve --allow-websocket-connection=localhost:5006 --allow-websocket-connection=localhost:8080 bokeh.py on the command line to start the bokeh server. Then I run my flash application on localhost: 8080.

 from flask import render_template, request, g from flask_appbuilder import ModelView, BaseView, expose, has_access from bokeh.embed import autoload_server class Bokeh(BaseView): default_view = 'bokeh' @expose("/") @has_access def bokeh(self): script = autoload_server(model=None, url="http://localhost:5006/bokeh") return self.render_template('bokeh.html', bokeh_script=script) appbuilder.add_view(Bokeh(), "Bokeh", href="/bokeh/") 

Checkbox bokeh.html template.

Has a button that I would like to somehow call a callback inside bokeh.py.

 {% extends "appbuilder/base.html" %} {% block content %} <script> $(document).ready(function () { document.getElementById("flaskButton").onclick = function () { // CODE HERE TO TRIGGER CALLBACK? }; }); </script> <div id="bokeh_app"> {{ bokeh_script|safe }} </div> <button id="flaskButton">Callback button in Flask</button> {% endblock %} 

Answer 1

The quick and dirty way is to right-click on the Bokeh button in your browser and select “Inspect Element”. You should see a specific onClick function. From there, you can provide the same onClick function to your button in your Flask application:

 $(document).ready(function () { document.getElementById("flaskButton").onclick = [onClick function from Bokeh button]; }); 

The above applies only if you want to save both buttons.