第一步 4: 自定义你的绘图#
在之前的入门指南中，你生成了不同的字形，并添加了更多信息，例如标题、图例和注释。
在本节中，你将自定义绘图的整体外观。这包括调整大小你的绘图，更改其线条和颜色，以及自定义坐标轴和工具。
使用主题#
借助 Bokeh 的主题，你可以快速更改绘图的外观。主题是一组预定义的设参数，例如颜色、字体或线条样式。
Bokeh 带有五个内置主题：caliber、dark_minimal、light_minimal、night_sky 和 contrast。此外，你可以定义自己的自定义主题。
要使用内置主题之一，请将你要使用的主题名称分配给文档的 theme 属性
from bokeh.io import curdoc
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# apply theme to current document
curdoc().theme = "dark_minimal"
# create a plot
p = figure(sizing_mode="stretch_width", max_width=500, height=250)
# add a renderer
p.line(x, y)
# show the results
show(p)
你还可以创建自己的主题，以便在多个绘图中使用。Bokeh 的主题可以是 YAML 或 JSON 格式。要了解有关创建和使用自定义主题的更多信息，请参阅用户指南中的创建自定义主题。
另请参阅
有关在 Bokeh 中使用主题的更多信息，请参阅用户指南中的使用主题以及参考指南中的bokeh.themes。
调整绘图大小#
Bokeh 的 Plot 对象具有各种属性，这些属性会影响绘图的外观。
设置宽度和高度#
要设置绘图的大小，请在调用 figure() 函数时使用属性 width 和 height
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a new plot with a specific size
p = figure(
title="Plot sizing example",
width=350,
height=250,
x_axis_label="x",
y_axis_label="y",
)
# add scatter renderer
p.scatter(x, y, fill_color="red", size=15)
# show the results
show(p)
与更改现有字形的设计类似，你可以在创建绘图后随时更改绘图的属性
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a new plot with a specific size
p = figure(
title="Plot resizing example",
width=350,
height=250,
x_axis_label="x",
y_axis_label="y",
)
# change plot size
p.width = 450
p.height = 150
# add scatter renderer
p.scatter(x, y, fill_color="red", size=15)
# show the results
show(p)
启用响应式绘图大小调整#
要使你的绘图自动调整为浏览器或屏幕大小，请使用属性 sizing_mode
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a new plot with responsive width
p = figure(
title="Plot responsive sizing example",
sizing_mode="stretch_width",
height=250,
x_axis_label="x",
y_axis_label="y",
)
# add scatter renderer
p.scatter(x, y, fill_color="red", size=15)
# show the results
show(p)
自定义坐标轴#
你可以设置各种属性来更改绘图中坐标轴的工作方式和外观。
设置坐标轴的外观#
用于自定义绘图外观的选项包括
为坐标轴设置标签
样式化与坐标轴一起显示的数字
定义坐标轴本身的颜色和其他布局属性
例如
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a plot
p = figure(
title="Customized axes example",
sizing_mode="stretch_width",
max_width=500,
height=350,
)
# add a renderer
p.scatter(x, y, size=10)
# change some things about the x-axis
p.xaxis.axis_label = "Temp"
p.xaxis.axis_line_width = 3
p.xaxis.axis_line_color = "red"
# change some things about the y-axis
p.yaxis.axis_label = "Pressure"
p.yaxis.major_label_text_color = "orange"
p.yaxis.major_label_orientation = "vertical"
# change things on all axes
p.axis.minor_tick_in = -3
p.axis.minor_tick_out = 6
# show the results
show(p)
定义坐标轴范围#
在绘制绘图的坐标轴时，Bokeh 会自动确定每个坐标轴需要覆盖的范围，以便显示所有值。例如，如果 y 轴上的值介于 2 和 17 之间，Bokeh 会自动创建一个 y 轴，其范围从略低于 2 到略高于 17。
要手动定义坐标轴的范围，请在使用 figure() 函数调用 Plot 对象时，使用 y_range() 函数或 y_range() 属性
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a new plot with responsive width
p = figure(
y_range=(0, 25),
title="Axis range example",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# add scatter renderer with additional arguments
p.scatter(x, y, size=8)
# show the results
show(p)
格式化坐标轴刻度#
你可以使用 Bokeh 的 TickFormatter 对象格式化坐标轴旁显示的文本。例如，使用这些格式化程序在 y 轴上显示货币符号
要显示美元金额而不是仅在 y 轴上显示数字，请使用 NumeralTickFormatter
首先，从 bokeh.models 导入 NumeralTickFormatter
from bokeh.models import NumeralTickFormatter
然后，在使用 figure() 函数创建绘图后，将 NumeralTickFormatter 分配给绘图的 yaxis 的 formatter 属性
p.yaxis[0].formatter = NumeralTickFormatter(format="$0.00")
NumeralTickFormatter 支持不同的格式，包括 "$0.00" 以生成诸如 "$7.42" 之类的值。
这是完成的代码的样子
from bokeh.models import NumeralTickFormatter
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create new plot
p = figure(
title="Tick formatter example",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# format axes ticks
p.yaxis[0].formatter = NumeralTickFormatter(format="$0.00")
# add renderers
p.scatter(x, y, size=8)
p.line(x, y, color="navy", line_width=1)
# show the results
show(p)
另请参阅
有关格式化刻度的更多信息，请参阅用户指南中的刻度标签格式。有关所有可用刻度格式化程序的列表，请参阅参考指南中的formatters。
启用对数坐标轴#
你也可以完全更改坐标轴类型。使用 y_axis_type="log" 切换到对数坐标轴
from bokeh.plotting import figure, show
# prepare some data
x = [0.1, 0.5, 1.0, 1.5, 2.0, 2.5, 3.0]
y0 = [i**2 for i in x]
y1 = [10**i for i in x]
y2 = [10**(i**2) for i in x]
# create a new plot with a logarithmic axis type
p = figure(
title="Logarithmic axis example",
sizing_mode="stretch_width",
height=300,
max_width=500,
y_axis_type="log",
y_range=[0.001, 10 ** 11],
x_axis_label="sections",
y_axis_label="particles",
)
# add some renderers
p.line(x, x, legend_label="y=x")
p.scatter(x, x, legend_label="y=x", fill_color="white", size=8)
p.line(x, y0, legend_label="y=x^2", line_width=3)
p.line(x, y1, legend_label="y=10^x", line_color="red")
p.scatter(x, y1, legend_label="y=10^x", fill_color="red", line_color="red", size=6)
p.line(x, y2, legend_label="y=10^x^2", line_color="orange", line_dash="4 4")
# show the results
show(p)
启用日期时间坐标轴#
将 x_axis_type 或 y_axis_type 设置为 datetime 以在坐标轴上显示日期或时间信息。然后，Bokeh 会创建一个 DatetimeAxis。
要格式化 DatetimeAxis 的刻度，请使用 DatetimeTickFormatter。
import random
from datetime import datetime, timedelta
from bokeh.models import DatetimeTickFormatter, NumeralTickFormatter
from bokeh.plotting import figure, show
# generate list of dates (today's date in subsequent weeks)
dates = [(datetime.now() + timedelta(day * 7)) for day in range(0, 26)]
# generate 25 random data points
y = random.sample(range(0, 100), 26)
# create new plot
p = figure(
title="datetime axis example",
x_axis_type="datetime",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# add renderers
p.scatter(dates, y, size=8)
p.line(dates, y, color="navy", line_width=1)
# format axes ticks
p.yaxis[0].formatter = NumeralTickFormatter(format="$0.00")
p.xaxis[0].formatter = DatetimeTickFormatter(months="%b %Y")
# show the results
show(p)
自定义网格#
要更改网格的外观，请设置 Plot 对象的 xgrid()、ygrid() 和 grid() 方法的各种属性。
样式化线条#
通过设置各种 grid_line 属性，更改网格的水平线和垂直线的外观
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a plot
p = figure(
title="Customized grid lines example",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# add a renderer
p.line(x, y, line_color="green", line_width=2)
# change things only on the x-grid
p.xgrid.grid_line_color = "red"
# change things only on the y-grid
p.ygrid.grid_line_alpha = 0.8
p.ygrid.grid_line_dash = [6, 4]
# show the results
show(p)
另请参阅
有关线条和次要线条的更多信息，请参阅用户指南中的线条。
使用带区和边界#
使绘图更易于阅读的另一种方法是使用带区和边界。
带区和边界是你在使用注释中了解到的注释的更多示例。
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a plot
p = figure(
title="Bands and bonds example",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# add a renderer
p.line(x, y, line_color="green", line_width=2)
# add bands to the y-grid
p.ygrid.band_fill_color = "olive"
p.ygrid.band_fill_alpha = 0.1
# define vertical bonds
p.xgrid.bounds = (2, 4)
# show the results
show(p)
设置背景颜色#
你有多种选项可以在 Bokeh 中定义颜色。例如
使用命名的 CSS 颜色之一（例如，
"firebrick"）使用十六进制值，以
#开头（例如"#00ff00"）使用 RGB 颜色的 3 元组（例如，
(100, 100, 255)使用 RGBA 颜色的 4 元组（例如
(100, 100, 255, 0.5)）
要更改 Bokeh 绘制绘图元素的平面的外观，请使用 Plot 对象的各种 fill_color 属性
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a plot
p = figure(
title="Background colors example",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# add a renderer
p.line(x, y, line_color="green", line_width=2)
# change the fill colors
p.background_fill_color = (204, 255, 255)
p.border_fill_color = (102, 204, 255)
p.outline_line_color = (0, 0, 255)
# show the results
show(p)
另请参阅
有关 Bokeh 中颜色的更多信息，请参阅参考指南中 Color 的条目。
自定义工具栏#
Bokeh 附带一个强大的工具栏来浏览绘图。你在第一个可视化中看到了这些工具，作为第一步指南 1的一部分。
定位工具栏#
要定义工具栏的位置，请将 toolbar_location 属性与以下值之一一起使用：above、below、left、right
在创建图形时，将值传递给 toolbar_location
p = figure(title="Toolbar positioning example", toolbar_location="below")
另一种选择是在创建图形后随时更改属性 toolbar_location
p.toolbar_location = "below"
停用和隐藏工具栏#
要完全停用工具栏，请将 toolbar_location 设置为 None。
p.toolbar_location = None
要使工具栏自动隐藏，请将 autohide 设置为 True
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a plot
p = figure(
title="Toolbar autohide example",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# activate toolbar autohide
p.toolbar.autohide = True
# add a renderer
p.line(x, y)
# show the results
show(p)
当 autohide 设置为 True 时，除非鼠标位于绘图区域内或你在绘图区域内点击，否则 Bokeh 将隐藏工具栏
类似地，使用 Toolbar 的 logo 属性停用 Bokeh 徽标
p.toolbar.logo = None
自定义可用工具#
你可以自定义 Bokeh 在工具栏中显示的工具。有关所有可用工具的详细列表，请参阅用户指南中的绘图工具。
要自定义要使用的工具，首先需要导入相关工具。例如
from bokeh.models.tools import BoxZoomTool, ResetTool
接下来，通过将 tools 属性传递给 figure() 函数，定义在创建新图形时要使用的工具。
tools 属性接受工具列表。此示例仅启用 BoxZoomTool 和 ResetTool
p = figure(tools = [BoxZoomTool(), ResetTool()])
这样，工具栏中将仅提供框缩放工具和重置工具
要在创建图形后随时更改可用工具，请使用 add_tools() 和 remove_tools() 函数。
所有工具还提供各种属性来定义它们的使用方式。例如，使用 PanTool，你可以将移动限制为仅水平或垂直平移。默认行为是允许在两个方向上平移。
from bokeh.models import BoxZoomTool, PanTool, ResetTool
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
# create a plot
p = figure(
title="Modifying tools example",
tools=[BoxZoomTool(), ResetTool()],
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# add an additional pan tool
# only vertical panning is allowed
p.add_tools(PanTool(dimensions="width"))
# add a renderer
p.scatter(x, y, size=10)
# show the results
show(p)
在此示例中，你首先在创建函数时包含框缩放工具和重置工具。接下来，你添加一个平移缩放工具。这导致所有三个工具都可用
添加工具提示#
工具提示是当你将鼠标悬停在数据点上或点击数据点时出现的小窗口
工具提示基于 HoverTool。悬停工具是 Bokeh 工具栏的一部分。
有几种方法可以在 Bokeh 中启用工具提示。这是最快的方法
从
bokeh.models.tools导入HoverTool类。在调用
figure()函数时，将HoverTool()包含在传递给tools参数的列表中。在调用
figure()函数时，包含tooltips参数。
tooltips 参数接受带有特殊语法的字符串。使用“@”符号包含要 Bokeh 显示的数据源的名称。此示例包含 @x 和 @y。当浏览器显示工具提示时，Bokeh 会将这两个字段替换为列表 x 和 y 中的实际数据。
这是代码的样子
from bokeh.models import HoverTool
from bokeh.plotting import figure, show
# prepare some data
x = [1, 2, 3, 4, 5]
y = [4, 5, 5, 7, 2]
p = figure(
y_range=(0, 10),
toolbar_location=None,
tools=[HoverTool()],
tooltips="Data point @x has the value @y",
sizing_mode="stretch_width",
max_width=500,
height=250,
)
# add renderers
p.scatter(x, y, size=10)
p.line(x, y, line_width=2)
# show the results
show(p)