提问人:btgorman 提问时间:11/17/2023 最后编辑:btgorman 更新时间:11/17/2023 访问量:34
首次访问页面时,Flask 不加载散景图 (HTMX)
Flask does not load Bokeh plot when first time visiting page (HTMX)
问:
我正在使用 flask 文件 (run_server.py) 在 index.html 和 home.html 之间交替(下面提供的代码)。
有一个 HTMX 按钮可以将我从 index.html 带到 home.html。还有一个类似的按钮可以将我从 home.html 带到 index.html。
我第一次从 index.html 转到 home.html 时,嵌入的散景图没有显示。但是每次我从 index.html 转到 home.html 时,情节都会按照我的预期显示。为什么第一次不显示?
run_server.py
from flask import Flask, render_template
from bokeh.plotting import figure
from bokeh.embed import components
from bokeh.resources import CDN
p = figure(width=300, height=300, tools='pan,reset,save')
p.circle([1, 2.5, 3, 2], [2, 3, 1, 1.5], radius=0.3, alpha=0.5)
cscript, cdiv = components(p)
app = Flask(__name__)
@app.route('/', methods=['GET'])
def page_index():
return render_template('index.html')
@app.route('/home', methods=['GET'])
def page_home():
return render_template('home.html',
script=cscript,
div=cdiv,
resources=CDN.render())
索引.html
<html>
<script src="https://unpkg.com/[email protected]"></script>
<body>
<p>"This is index.html"</p>
<button class='btn' hx-get="/home" hx-target="body">
Click Me!
</button>
</body>
</html>
Home.HTML(这个有散景图)
<p>"This is home.html"</p>
<button class='btn' hx-get="/" hx-target="body">
Click Me!
</button>
<div id="bokeh_plot_1">
{{ resources | safe }}
{{ script | safe }}
{{ div | safe }}
</div>
答:
0赞
mariodev
11/17/2023
#1
您需要从 index.html 加载 js cdn 资源(最好在 head 标签内)。
一旦浏览器加载了主要资源,那么 htmx 将从 ajax 响应中正确处理脚本。
评论