我正在尝试在Django中实现bokeh实时图表。我在一个网站上得到了一些参考。他们使用add_periodic_callback中的curdoc()功能刷新图表。通过运行bokeh serve filename.py可以正常工作。我在django中通过在view.py
def bokeh(request):
import numpy as np
from bokeh.layouts import column
from bokeh.models import Button
from bokeh.palettes import RdYlBu3
from bokeh.plotting import figure, curdoc
import pandas as pd
# create a plot and style its properties
p = figure(x_axis_type="datetime", title="EUR USD", plot_width=1000)
p.grid.grid_line_alpha = 0
p.xaxis.axis_label = 'Date'
p.yaxis.axis_label = 'Price'
p.ygrid.band_fill_color = "olive"
p.ygrid.band_fill_alpha = 0.1
# add a text renderer to out plot (no data yet)
r = p.line(x = [], y = [], legend='close', color='navy')
i = 0
ds = r.data_source
# create a callback that will add a number in a random location
def callback():
global i
a = fxdata()[0] ## this script will return EURUSD forex data as list
ds.data['x'].append(np.datetime64(str(a[1])))
ds.data['y'].append(np.float(a[2]))
ds.trigger('data', ds.data, ds.data)
i = i + 1
# add a button widget and configure with the call back
button = Button(label="Press Me")
# button.on_click(callback)
# put the button and plot in a layout and add to the document
curdoc().add_root(column(button, p))
curdoc().add_periodic_callback(callback, 1000)
script, div = components(curdoc())
return render_to_response( 'bokeh/index.html', {'script' : script , 'div' : div} )
[当我尝试此代码时，我得到的散景图框架为空。我们可以在Django中使用add_periodic_callback函数来做到这一点吗？或任何其他类似的方式来刷新图表。
任何人都可以帮助我。如果您觉得它无法理解，请在此处评论。您的帮助将不胜感激。预先感谢。
我认为您可以使用嵌入式服务器文档：
from bokeh.embed import server_document
script = server_document("https://demo.bokeh.org/slider")
这会输出bokeh服务器页面的<script></script>，您可以将其嵌入文档中。
来源：https://docs.bokeh.org/en/latest/docs/user_guide/embed.html#app-documents
代替使用curdoc()，而是使用驻留在components()中的bokeh.embed函数，然后使用ajax使它生效。
`def bokeh(request):
window_size = 100
window = np.ones(window_size) / float(window_size)
#data_avg = np.convolve(data, window, 'same')
TOOLS = "resize,pan,wheel_zoom,box_zoom,reset,save"
p2 = figure(x_axis_type="datetime", title="abc", plot_width=1000)
p2.grid.grid_line_alpha = 0
p2.xaxis.axis_label = 'Date'
p2.yaxis.axis_label = 'Price'
p2.ygrid.band_fill_color = "olive"
p2.ygrid.band_fill_alpha = 0.1
p2.line(data_dates, data, legend='close', color='navy')
# p2.line(data_dates, data2, legend='SMA-15', color='green')
#p2.line(data_dates, data_avg, legend='avg', color='navy')
p2.legend.location = "top_left"
script, div = components(p2)
return render_to_response( 'bindex.html', {'script' : script , 'div' : div} )`
Ajax：
<script>
function refresh_bokeh() {
$.ajax({
url: '{% url 'bokeh' %}',
success: function(data) {
$('#bo').html(data);
}
});
}
setTimeout(function(){
refresh_bokeh();
}, 2000);
</script>
HTML：
{% load staticfiles %}
<! DOCTYPE html>
<html lang="en">
<head>
<script src="http://cdn.bokeh.org/bokeh/release/bokeh-0.12.14.min.js"></script>
<script src="http://cdn.bokeh.org/bokeh/release/bokeh-widgets-0.12.14.min.js"></script>
<link href="http://cdn.bokeh.org/bokeh/release/bokeh-0.12.14.min.css" rel="stylesheet" type="text/css">
<link href="http://cdn.bokeh.org/bokeh/release/bokeh-widgets-0.12.14.min.css" rel="stylesheet" type="text/css">
{{ script | safe }}
</head>
<body>
<div id = "bo">
{{ div | safe }}
{% csrf_token %}
</div>
</body>
</html>