Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to embed standalone bokeh graphs into django templates

I want to display graphs offered by the bokeh library in my web application via django framework but I don't want to use the bokeh-server executable because it's not the good way. so is that possible? if yes how to do that?

like image 797
Ghada Ben Tekfa Avatar asked Apr 08 '15 07:04

Ghada Ben Tekfa


People also ask

How do you insert a bokeh plot?

You can achieve this with the server_document() function. This function accepts the URL to a Bokeh server application and returns a script that embeds a new session from that server every time the script executes. You can add this tag to an HTML page to include the Bokeh application at that point.

How do I save HTML in bokeh?

Bokeh creates the HTML file when you call the show() function. This function also automatically opens a web browser to display the HTML file. If you want Bokeh to only generate the file but not open it in a web browser, use the save() function instead.

How do you start a bokeh server?

To run a Bokeh server instance, use commands similar to the following: serve myapp.py --port 5100 serve myapp.py --port 5101 ... Next, in the location stanza for the Bokeh server, change the proxy_pass value to refer to the upstream stanza above. The code below uses proxy_pass http://myapp; .


2 Answers

Using the Embedding Bokeh Plots documentation example as suggested by Fabio Pliger, one can do this in Django:

in the views.py file, we put:

from django.shortcuts import render from bokeh.plotting import figure from bokeh.resources import CDN from bokeh.embed import components  def simple_chart(request):     plot = figure()     plot.circle([1,2], [3,4])      script, div = components(plot, CDN)      return render(request, "simple_chart.html", {"the_script": script, "the_div": div}) 

in the urls.py file we can put :

from myapp.views import simple_chart  ... ... ... url(r'^simple_chart/$', simple_chart, name="simple_chart"), ... ... 

in the template file simple_chart.html we'll have :

<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>Experiment with Bokeh</title>     <script src="http://cdn.bokeh.org/bokeh/release/bokeh-0.8.1.min.js"></script>     <link rel="stylesheet" href="http://cdn.bokeh.org/bokeh/release/bokeh-0.8.1.min.css"> </head> <body>      {{ the_div|safe }}      {{ the_script|safe }} </body> </html>  

And it works.

like image 130
iMitwe Avatar answered Sep 21 '22 11:09

iMitwe


You don't need to use bokeh-server to embed bokeh plots. It just means you'll not be using (and probably don't need) the extra features it provides.

In fact you can embed bokeh plots in many ways like generating standalone html, by generating bokeh standalone components that you can then embed in you django app when rendering templates or with the method we call "autoloading" which makes bokeh return a tag that will replace itself with a Bokeh plot. You'll find better details looking at the documentation.

Another good source of inspiration is the embed examples you can find in the repository.

like image 21
Fabio Pliger Avatar answered Sep 22 '22 11:09

Fabio Pliger