Trouble embedding Bokeh plot into Flask app

I'm new both to Bokeh and Flask. I browsed related questions, tutorials, and looked at Bokeh docs but could not figure out what I'm doing wrong.

That being said, I want to create a simple web-app in which I "group together" various data reports and plots.

According to what I read, I came up with the following:

app.py:

... # imports

app = Flask(__name__, static_url_path='/static')

@app.route("/")
def index():
  return render_template("index.html")

@app.route("/bokeh_test")
def bokeh_test():

  script, div = components(sample_plot())

  return render_template("bokeh_test.html", script=script, div=div)


def sample_plot():
   """
   A random plot just for testing purposes.
   :return: plot
   """

   PLOT_OPTIONS = dict(plot_width=600, plot_height=400)
   SCATTER_OPTIONS = dict(size=12, alpha=0.5)

   data = lambda: [random.choice([i for i in range(100)]) for r in range(10)]

   plot = figure(sizing_mode='scale_both', tools='pan', **PLOT_OPTIONS)
   plot.scatter(data(), data(), color="red", **SCATTER_OPTIONS)

   # show(plot)

   return plot

bokeh_test.html:

<!DOCTYPE html>
<html lang="en">
 <head>
   <!-- Bokeh includes-->
  <script type="text/javascript" src="http://cdn.pydata.org/bokeh/release/bokeh-0.12.13.min.js"></script>
  <link rel="stylesheet" href="http://cdn.pydata.org/bokeh/release/bokeh-0.12.13.min.css" type="text/css" />
  {{ script|safe }}
 </head>
 <body>
   <div>
       <h1>Bokeh sample</h1>
           <div class='bokeh'>
           {{ div|safe }}
           </div>
   </div>
  </body>
</html>

Imagine in my index.html file I have a side bar with a link to bokeh_test.html. When I click it, all I see is the header "bokeh sample" but no plot.

If I uncomment the show(plot), a new tab is opened and the plot correctly displayed, so the problem seems not to be in the plot itself but in the way I try to embed it in bokeh_test.

I'm new to all this so maybe I'm doing something stupid but I haven't been able to figure it out and I'd appreciate some help.

PS. Not sure if might be related, but for this I created a python 3.6 environment from Anaconda 2, and I use this environment as the project interpreter.

You are loading BokehJS version 0.12.13 from CDN in your template. The version there needs to match the version of Bokeh installed in your system exactly.

来源：https://stackoverflow.com/questions/53474808/trouble-embedding-bokeh-plot-into-flask-app

标签

python

bokeh