javascript - 在 Flask 中嵌入 Bokeh 图

标签 javascript python flask bokeh

我期待得到 Flask 返回的简单线条 Bokeh 图,但是当我浏览到 localhost:5002/simpleline 时得到的是这样的:

('', ' ')

我有两个文件。 Python 文件:

from bokeh.plotting import figure, show, output_file
from bokeh.embed import components
from flask import Flask, render_template
app=Flask(__name__)

@app.route('/simpleline/')
def simpleLine():
    fig=figure(title="Sensor data")
    fig.line([1,2,3,4],[2,4,6,8])
    div=components(fig)
    return render_template('simpleline.html',div=div)
    show(fig)

if __name__ == "__main__":
    app.run(debug=True,port=5002)

和 HTML 模板:

<!doctype html>
<html>
<head>
 <title>Figure examples</title>
 <link rel="stylesheet" href="http://cdn.bokeh.org/bokeh-0.7.1.min.css" type="text/css" />
 <script type="text/javascript"src="http://cdn.bokeh.org/bokeh-0.7.1.min.js"></script>
</head>
<body>
<div class='bokeh'>
 {{ div|safe }}
</div>
</body>
</html>

我确信我在这里遗漏了一些重要的东西。

经过mn的回答,发现components()产生了两个元素,一个Javascript字符串,一个html div。因此,我按如下方式更新了脚本,但这次网页显示为空白。

from bokeh.plotting import figure, show, output_file
from bokeh.embed import components
from flask import Flask, render_template
app=Flask(__name__)

@app.route('/simpleline/')
def simpleLine():
    fig=figure(title="Sensor data")
    fig.line([1,2,3,4],[2,4,6,8])
    global script
    global div
    script,div=components(fig)
    return render_template('simpleline.html',div=div,script=script)
    output_file("simpleline.html")
    show(fig)

fig=figure(title="Sensor data")
fig.line([1,2,3,4],[2,4,6,8])
script,div=components(fig)
if __name__ == "__main__":
    app.run(debug=True,port=5002)

和 HTML 模板:

<!doctype html>
<html>
 <head>
  <title>Figure examples</title>
  <link rel="stylesheet" href="http://cdn.bokeh.org/bokeh-0.9.0.min.css" type="text/css" />
  <script type="text/javascript" src="http://cdn.bokeh.org/bokeh-0.9.0.min.js"></script>
  {{ script|safe }}
 </head>
 <body>
  <div class='bokeh'>
   {{ div|safe }}
  </div>
 </body>
</html>

我尝试了所有 bokeh-0.7.1.min.js、0.9 和 0.10,但我仍然得到相同的空白页。

最佳答案

components()返回 (script, div)包含 <script> 的元组其中包含您的绘图数据和随附的 <div>绘图 View 加载到的标签:

http://docs.bokeh.org/en/latest/docs/user_guide/embed.html#components

script, div = components(fig)
return render_template('simpleline.html',div=div, script=script)

模板

<!doctype html>
<html>
 <head>
  <title>Figure examples</title>
  <link rel="stylesheet" href="http://cdn.bokeh.org/bokeh/release/bokeh-0.10.0.min.css" type="text/css" />
  <script type="text/javascript" src="http://cdn.bokeh.org/bokeh/release/bokeh-0.10.0.min.js"></script>
  {{ script|safe }}
 </head>
 <body>
  <div class='bokeh'>
   {{ div|safe }}
  </div>
 </body>
</html>

关于javascript - 在 Flask 中嵌入 Bokeh 图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33450773/

相关文章:

javascript - ng-click 在 ng-repeat 中不起作用

javascript - YUI 3. 以编程方式触发 onSubmit

javascript - 使用映射插件在 KnockoutJS 中扩展 View 模型

python - 谷歌 Colab 错误 : Buffered data was truncated after reaching the output size limit

python - 如何使列表中的变量可识别为数字?

python-3.x - 有什么方法可以在 flask 邮件中命名附加的pdf文件吗?

python - 为什么使用 Apache + mod_wsgi 的 Flask 应用程序上的 gevent 会引发 NotImplementedError?

php - JavaScript 表单验证 HTML 表格中的行

python - 使用索引数组中的索引元组索引多维数组 - NumPy/Python

python - 需要一些帮助以python身份验证github API