Search code examples
djangobokeh

Embeding bokeh plot into a template (django)

I'm trying to embed a bokeh plot into a template (home.html), but nothing is displayed after executing the code. here's the code.

views.py (all packages are imported)

def home(request):

s = [1,4,6,8]
h = [1,5,9,8]

p = figure(plot_width=600, plot_height=600)
p.vbar(x=s, width=0.5, bottom=0,
       top=h, color="black")

script, div = components(p, CDN)
return render(request, 'home.html', {'div': div, 'script': script})

home.html

<!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>
    <h1>hello</h1>

    {{ div|safe }}

    {{ script|safe }}


</body>
</html>

it displays nothing at the end, there's no error message, but and the page is completely blank

Help, Please!!

Solution

  • You are loading an ancient version of BokehJS from CDN:

    <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">

    The 0.8.1 release is now several years old. By contrast, the vbar glyph method that you are using was only added quite recently. You need to make sure that the version of the BokehJS resources that you load in your template actually match the version of the Bokeh library that you are using.