Bokeh – Vertical layout of plots

Bokeh includes several layout options for arranging plots and widgets. They make it possible to arrange multiple components to create interactive data applications. The layout functions helps build a grid of plots and widgets. It supports nesting of as many rows, columns, or grids of plots together as required. In addition, Bokeh layouts support a number of “sizing modes”. These sizing modes allow plots and widgets to resize based on the browser window.

In bokeh multiple layouts can be shown in a single column itself.

Syntax:

column(plot1, plot2, …, plotn)

Approach

• Import module
• Create multiple plots
• Align using column()
• Display plot

Example 1:

Python3

# python program for bokeh column layout
from bokeh.io import output_file, show
from bokeh.layouts import column
from bokeh.plotting import figure

# output will be in GFG.html
output_file("GFG.html")
currentList = list(range(7))

# creating three Lists List1,List2,List3
List1 = currentList
List2 = [i/2 for i in currentList]
List3 = [i*2 for i in currentList]

# creating three plots f1,f2,f3
f1 = figure(plot_width=200, plot_height=150, background_fill_color="#fc8803")
f1.circle(currentList, List1, size=12, color="#53777a", alpha=0.8)

f2 = figure(plot_width=200, plot_height=150, background_fill_color="#fc8803")
f2.triangle(currentList, List2, size=12, color="#c02942", alpha=0.8)

f3 = figure(plot_width=200, plot_height=150, background_fill_color="#fc8803")
f3.square(currentList, List3, size=12, color="#d95b43", alpha=0.8)
# show plots in column
show(column(f1, f2, f3))

Output :

Example 2 :

Python3

# python program for bokeh column layout
from bokeh.io import output_file, show
from bokeh.layouts import column
from bokeh.plotting import figure

# output will be in GFG.html
output_file("GFG.html")
currentList = list(range(7))

List1 = currentList
List2 = [i % 2 for i in currentList]
List3 = [i % 10 for i in currentList]

f1 = figure(plot_width=200, plot_height=150, background_fill_color="#fc8803")
f1.circle(currentList, List1, size=12, color="#53777a", alpha=0.8)

f2 = figure(plot_width=200, plot_height=150, background_fill_color="#fc8803")
f2.triangle(currentList, List2, size=12, color="#c02942", alpha=0.8)

f3 = figure(plot_width=200, plot_height=150, background_fill_color="#fc8803")
f3.square(currentList, List3, size=12, color="#d95b43", alpha=0.8)

show(column(f1, f2, f3))

Output :