【发布时间】:2019-05-09 18:50:08
【问题描述】:
亲爱的,
我有一个包含三个或更多选项卡的情节。我真的很抱歉代码太长,但我无法让它工作。
下面是散景脚本文件。
导入散景嵌入库
from bokeh. embed import components
from bokeh.resources import CDN
合并选项卡的代码的最后几行。
############### TABS 1 ############
grid = gridplot([[V_Traffic, D_Traffic]])
tab1 = Panel(child=grid, title="LTE")
############### TABS 2 ############
p2 = figure(plot_width=300, plot_height=300)
p2.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=3, color="navy", alpha=0.5)
tab2 = Panel(child=p2, title="line")
############### TABS 3 ############
p3 = figure(plot_width=300, plot_height=300)
p2.triangle([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=3, color="pink", alpha=0.5)
tab3 = Panel(child=p3, title="triangle")
tabs = Tabs(tabs=[tab1, tab2, tab3])
## even with three tabs when I checked the length of len(components(tabs)) the answer was 2
## base on that I follow the lecture as is.
js, div = components(tabs)
cdn_js = CDN.js_files[0]
cdn_css = CDN.css_files[0]
below is my flask app code
from flask import Flask, render_template, cli
from stack_plot_grid_TAB_1 import js, div, cdn_js, cdn_css
app = Flask(__name__)
@app.route("/")
def home():
return render_template("index.html")
@app.route('/execute')
def execute_grid_tab():
return render_template("stack_plot_grid_TAB_1.html", js=js, div=div, cdn_js=cdn_js, cdn_css=cdn_css)
if __name__ == "__main__":
app.run(debug=True)
在索引文件中,我已经给出了一个指向另一个文件的链接,一旦用户 选择相应的仪表板。
下面是 index.html 的代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<a href="#" onclick="window.open('/execute');
window.open('C:\py\programs\bokeh\flask\templates\stack_plot_grid_TAB_1.html');">
<button>execute python script for tabs</button></a>
</body>
</html>
下面是我的最终情节应该显示的代码。
stack_plot_grid_TAB_1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel='stylesheet' href={{cdn_css|safe}} type="text/css"/>
<script type="text/javascript" src={{cdn_js|safe}}></script>
</head>
<body>
<button>this is the new page.</button>
{{js|safe}}
{{div|safe}}
</body>
</html>
所有“html”文件都保存在“templates”文件夹中。
最后,它只是说“这是新页面”并且图表不可见。还有什么需要我做的吗?
最好的问候。
【问题讨论】: