将本地html文件嵌入Reveal.js中

时间:2018-07-05 16:32:47

标签: javascript html iframe bokeh reveal.js

我想在我的bokeh演示文稿中导入reveal.js交互式图形。

我能做什么

  1. 我可以使用iframe将html内容嵌入Reveal.js中:
<iframe data-src="https://demo.bokehplots.com/apps/sliders" 
width="445" height="355" frameborder="0" marginwidth="0" marginheight="0" 
scrolling="no" style="border:3px solid #666; margin-bottom:5px; max-width:
100%;" allowfullscreen=""></iframe>
  1. 我可以以html格式保存散景图:
from bokeh.plotting import figure, output_file, show

output_file("/line.html")
p = figure(plot_width=400, plot_height=400)
p.circle([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], size=20, color="navy", alpha=0.5)
show(p)

当我使用网络浏览器打开文件line.html时可以看到它并与之交互。

我不能做的事

将我的line.html文件嵌入Reveal.js中。

我尝试过:

  1. <iframe data-src="/Users/JohnDoe/line.html" width="945" height="555" frameborder="0" marginwidth="0" marginheight="0" scrolling="yes" style="border:3px solid #666; margin-bottom:5px; max-width: 600%;" allowfullscreen=""></iframe>

    这导致消息Cannot GET /Users/JohnDoe/line.html显示在我的iframe中。

  2. <iframe data-src="file:///Users/JohnDoe/line.html" width="945" height="555" frameborder="0" marginwidth="0" marginheight="0" scrolling="yes" style="border:3px solid #666; margin-bottom:5px; max-width: 600%;" allowfullscreen=""></iframe>

    在杂乱中什么也没显示。

我想做什么

我希望将我的.html文件显示在iframe中,因为它正在“我能做什么”部分的1.中工作。

1 个答案:

答案 0 :(得分:1)

Reveal.js输出是从某种本地服务器显示的,对吗?在这种情况下,AFAIK IFrame将不允许您从本地文件加载。通常,您无法从file:\\加载http:\\,因为这将是一个巨大的安全漏洞。一种解决方案是运行基本的HTTP服务器来提供Bokeh HTML文件,例如python -m http.server(或对于旧版Python 2为python -m SimpleHTTPServer),并让IFrame从简单服务器加载Bokeh页面。