UPDATE: the create_html_snippet
function mentioned in the original question was deprecated and removed years ago. There are now various newer ways to embed Bokeh content available in the bokeh.embed
module. This answer will summarize some of them.
Standalone Content
Standalone Bokeh content is pure HTML/JS/CSS that is not backed by a running Bokeh server. However, standalone Bokeh content can still be highly interactive, with plot tools (e.g. pan, zoom, selection), linked brushing, and widgets that trigger CustomJS actions. There are several ways to embed standalone content:
json_item
If you would like to create a pure JSON representation of the content that can be loaded by JS functions, you can use the json_item
function. As an example, you might server the JSON from a Flask endpoint:
@app.route('/plot')
def plot():
p = make_plot('petal_width', 'petal_length')
return json.dumps(json_item(p, "myplot"))
Then the page can load and render the content with JavaScript code like this:
<div id="myplot"></div>
<script>
fetch('/plot')
.then(function(response) { return response.json(); })
.then(function(item) { Bokeh.embed.embed_item(item); })
</script>
This assumes you have loaded the BokehJS library on the page, e.g. by templating CDN.render()
in the <head>
of the page. See a complete minimal example here.
components
If you would like to generate a simple <script>
tag and <div>
that can be templated into a page to, you can use the components
function:
from bokeh.plotting import figure
from bokeh.embed import components
plot = figure()
plot.circle([1,2], [3,4])
script, div = components(plot)
The returned script
and div
(or divs it you pass multiple items) can be inserted in to page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bokeh Scatter Plots</title>
<!-- COPY/PASTE BOKEHJS RESOURCES HERE -->
<!-- COPY/PASTE SCRIPT HERE -->
</head>
<body>
<!-- INSERT DIVS HERE -->
</body>
</html>
As above, you will need to hardcode or template the BokehJS JS and CSS resources in the page head, e.g. with CDN.render()
file_html
If you want to generate entire complete HTML pages (i.e. including <head></head><body></body>
), you can use the file_html
function:
from bokeh.plotting import figure
from bokeh.resources import CDN
from bokeh.embed import file_html
plot = figure()
plot.circle([1,2], [3,4])
html = file_html(plot, CDN, "my plot")
This generates a basic page that can be saved or served, etc. If desired you can also supply your own Jinja template (see docs for details).
Bokeh Server Applications
Bokeh server applications can connect Bokeh plots and widgets to a live running Python process, so that events like UI interactions, making selections, or widget manipulations can trigger real Python code (e.g. Pandas or scikit-learn).
To embed a basic Bokeh application in a page template, the most common method is to use server_document
:
from bokeh.embed import server_document
script = server_document("https://demo.bokeh.org/slider")
The returned script
can be templated anywhere in an HTML page, and the Bokeh application will appear there. There are many other possibilities, e.g. embedding app components individually, customizing sessions for users, or running behind proxies/load balancers. The Bokeh server may also need to be configured to allow access to the embedding page. For full details see the Running a Bokeh Server chapter of the Users Guide.
Another, possibly simpler way to "embed" a Bokeh server application, is to use IFrames pointing at the public URL of a running Bokeh app.