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.bokeh.org/bokeh/release/bokeh-0.12.13.min.js"></script>
  <link rel="stylesheet" href="http://cdn.bokeh.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.

回答1:

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