I want to import bokeh interactive graphs in my reveal.js presentation.
<iframe data-src="https://demo.bokeh.org/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>
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)
which result in a file line.html
that I can see and interact with when I open it with my web-browser.
Embed my line.html
file inside reveal.js.
<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>
This result in the message Cannot GET /Users/JohnDoe/line.html
displayed in my iframe.
<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>
And nothing is displayed in the trame.
I want that my .html file to be displayed in my iframe as it is working in 1. of the "What I can do" section.
Reveal.js output is displayed from a local server of some kind, correct? AFAIK IFrames will not allow you to load from local files in that case. In general, you cannot load file:\\
from http:\\
because that would be a giant security hole. A solution would be to run a basic HTTP server to serve the Bokeh HTML files, e.g python -m http.server
(or python -m SimpleHTTPServer
for legacy Python 2) and have your IFrame load the Bokeh pages from the simple server.