Couldn't able to Embed Layout object into a Template

Community Support
1

Layout functions (gridplot, column, row) doesn’t have a name Attribute so I couldn’t able to embed layout into a template.

2

@Vignesh_M Much more information is needed to be able to help:

  • the actual code you tried to run
  • how you ran things
  • the exact error message that was generated
3

Hi @Bryan, I hope this would be helpful.

app/template/index.html

{% extends base %}
{% block preamble %}
{% endblock %}
{% block contents %}

{{ embed(roots.plot) }}
{{ embed(roots.gp) }} # ValueError: root with 'gp' name not found

{% endblock %}

app/main.py

import numpy as np
from bokeh.io import curdoc
from bokeh.layouts import column, row
from bokeh.models import ColumnDataSource, Slider, TextInput
from bokeh.plotting import figure

batchid = 2
func = {
1 : np.cos,
2 : np.sin,
3 : np.tan
}[batchid]

#Set up data
N = 200
x = np.linspace(0, 4*np.pi, N)
y = func(x)
source = ColumnDataSource(data=dict(x=x, y=y))

#Set up plot
plot = figure(plot_height=400, plot_width=400, title=“my wave”,
tools=“crosshair,pan,reset,save,wheel_zoom”,
x_range=[0, 4*np.pi], y_range=[-2.5, 2.5], name=‘plot’)

plot.line(‘x’, ‘y’, source=source, line_width=3, line_alpha=0.6)

#Set up widgets
text = TextInput(title=“title”, value=“Batch n°{}”.format(batchid))
offset = Slider(title=“offset”, value=0.0, start=-5.0, end=5.0, step=0.1)
amplitude = Slider(title=“amplitude”, value=1.0, start=-5.0, end=5.0, name=‘amplitude’)
phase = Slider(title=“phase”, value=0.0, start=0.0, end=2*np.pi)
freq = Slider(title=“frequency”, value=1.0, start=0.1, end=5.1)

#Set up callbacks
def update_title(attrname, old, new):
plot.title.text = text.value

text.on_change(‘value’, update_title)

def update_data(attrname, old, new):

#Get the current slider values
a = amplitude.value
b = offset.value
w = phase.value
k = freq.value

#Generate the new curve
x = np.linspace(0, 4*np.pi, N)
y = a*func(k*x + w) + b

source.data = dict(x=x, y=y)

for w in [offset, amplitude, phase, freq]:
w.on_change(‘value’, update_data)

#Set up layouts and add to document
gp = gridplot([[text, offset, amplitude, phase, freq]])

curdoc().add_root(gp) #could not able to embed plot in a template
curdoc().add_root(plot) #could able to embed plot in a template

4

Hi @Vignesh_M please edit your post to use code formatting so that the code is intelligible (either with the </> icon on the editing toolbar, or triple backtick ``` fences around the code blocks)

5

Hi @Bryan, Thank you for your response.

app/template/index.html

{% extends base %}
{% block preamble %}
{% endblock %}
{% block contents %}

<div class="container body">
  <div class="main_container">
	<div>
		{{ embed(roots.plot) }}
    </div>
	<div>
		{{ embed(roots.gp) }} <!-- ValueError: root with 'gp' name not found -->
		<!-- Need to add gridplot here ... -->
	<div>
  </div>
</div>
{% endblock %}

app/main.py

import numpy as np
from bokeh.io import curdoc
from bokeh.layouts import column, row, gridplot
from bokeh.models import ColumnDataSource, Slider, TextInput
from bokeh.plotting import figure

batchid = 2
func = {
    1 : np.cos,
    2 : np.sin,
    3 : np.tan
}[batchid]

#Set up data
N = 200
x = np.linspace(0, 4*np.pi, N)
y = func(x)
source = ColumnDataSource(data=dict(x=x, y=y))

#Set up plot
plot = figure(plot_height=400, plot_width=400, title="my wave",
              tools="crosshair,pan,reset,save,wheel_zoom",
              x_range=[0, 4*np.pi], y_range=[-2.5, 2.5], name='plot')

plot.line('x', 'y', source=source, line_width=3, line_alpha=0.6)

#Set up widgets
text = TextInput(title="title", value="Batch n°{}".format(batchid))
offset = Slider(title="offset", value=0.0, start=-5.0, end=5.0, step=0.1)
amplitude = Slider(title="amplitude", value=1.0, start=-5.0, end=5.0, name='amplitude')
phase = Slider(title="phase", value=0.0, start=0.0, end=2*np.pi)
freq = Slider(title="frequency", value=1.0, start=0.1, end=5.1)

gp = gridplot([[text, offset, amplitude, phase, freq]])

curdoc().add_root(gp) # need to embed this object into template
curdoc().add_root(plot)

Note:

Couldn’t embed gp into the template,
by using gridplot I’m stacking lot of plots without size inequality, its much helpful in correlating plots.

6

@Vignesh_M That seems like an oversight on the gridplot helper function. However, you can set the name on the actual GridPlot model that is returned:

gp.name = "foo"
7

Hi @Bryan,

Thank you, it’s working :slight_smile:

8

Hi @Bryan,

is autoload_server() removed from the latest version of bokeh-2.0.2, Because I couldn’t import from bokeh.embed.

>>> from bokeh.embed import autoload_static
>>> from bokeh.embed import autoload_server
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
ImportError: cannot import name 'autoload_server' from 'bokeh.embed' (C:\Program Files\Python38\lib\site-packages\bokeh\embed\__init__.py)
9

It was deprecated several years ago, and removed in version 2.0

10

Thanks @Bryan

1 Like