绘图工具#
Bokeh 附带了许多交互式工具,您可以使用这些工具来报告信息,更改绘图参数(例如缩放级别或范围范围),或添加、编辑或删除图形。工具可以分为四类
- 手势
这些工具响应单个手势,例如平移移动。手势工具的类型包括
对于每种手势类型,一次只能有一个工具处于活动状态。活动工具将在工具栏中工具图标旁边突出显示。
- 动作
这些是仅在按下工具栏中的按钮时才会激活的立即或模态操作,例如
ResetTool
或ExamineTool
。- 检查器
这些是被动工具,以某种方式报告信息或注释绘图,例如
HoverTool
或CrosshairTool
。- 编辑工具
这些是复杂的多个手势工具,可以添加、删除或修改绘图上的图形。由于它们可能同时响应多个手势,因此激活的编辑工具可能会停用多个单个手势工具。
本章包含有关所有单个工具的信息,并描述了如何配置工具栏。
定位工具栏#
默认情况下,Bokeh 绘图在绘图上方带有一个工具栏。您可以更改工具栏的位置或将其删除。
您可以通过将 toolbar_location
参数传递给 figure()
函数来指定工具栏位置。有效值是
"above"
"below"
"left"
"right"
如果您想完全隐藏工具栏,请传递 None
。
下面的代码将工具栏定位在绘图下方。尝试运行代码并更改 toolbar_location
值。
from bokeh.plotting import figure, show
p = figure(width=400, height=400,
title=None, toolbar_location="below")
p.scatter([1, 2, 3, 4, 5], [2, 5, 8, 2, 7], size=10)
show(p)
请注意,工具栏位置与默认轴冲突。在这种情况下,将 toolbar_sticky
选项设置为 False
将使工具栏移动到轴绘制区域之外。
from bokeh.plotting import figure, show
p = figure(width=400, height=400,
title=None, toolbar_location="below",
toolbar_sticky=False)
p.scatter([1, 2, 3, 4, 5], [2, 5, 8, 2, 7], size=10)
show(p)
指定工具#
在最低 bokeh.models 级别,您可以通过将 Tool
对象的实例传递给 add_tools()
方法,将工具添加到 Plot
中。
from bokeh.models import LassoSelectTool, Plot, WheelZoomTool
plot = Plot()
plot.add_tools(LassoSelectTool())
wheel = WheelZoomTool()
plot.add_tools(wheel)
这种添加工具的方式适用于任何 Bokeh Plot
或 Plot
子类,例如 figure
。
您可以通过将 tools
参数传递给 figure()
函数来指定工具。tools 参数接受工具对象的列表,例如
from bokeh.models import BoxZoomTool, ResetTool
from bokeh.plotting import figure
plot = figure(tools=[BoxZoomTool(), ResetTool()])
您也可以使用包含工具快捷方式名称的逗号分隔字符串添加多个工具
from bokeh.plotting import figure
plot = figure(tools="pan,wheel_zoom,box_zoom,reset")
此方法不允许设置工具的属性。
通过将工具对象传递给绘图的 remove_tools()
方法来删除工具。
from bokeh.models import BoxSelectTool, WheelZoomTool
from bokeh.plotting import figure
tools = box, wheel = BoxSelectTool(dimensions="width"), WheelZoomTool()
plot = figure(tools=tools)
plot.remove_tools(box)
自定义工具图标#
您可以通过将其传递给 description
关键字,使用绘图的 add_tools()
方法或其任何实例(如 figure()
)来更改 tools 工具提示。
plot.add_tools(BoxSelectTool(description="My tool"))
也可以使用 icon
关键字更改工具图标。
您可以传递
一个众所周知的图标名称
plot.add_tools(BoxSelectTool(icon="box_zoom"))
一个 CSS 选择器
plot.add_tools(BoxSelectTool(icon=".my-icon-class"))
一个图像路径
plot.add_tools(BoxSelectTool(icon="path/to/icon"))
设置活动工具#
Bokeh 工具栏最多可以从每种手势类型(拖动、滚动、轻触)中包含一个活动工具。
但是,可以控制哪个工具处于活动状态。在最低 bokeh.models 级别,您可以使用 active_drag
、active_inspect
、active_scroll
和 active_tap
属性。这些属性可以取以下值
None
— 此类没有活动工具"auto"
— Bokeh 选择此类工具作为活动工具(可能没有)一个
Tool
实例 — Bokeh 将给定的工具设置为活动工具
此外,active_inspect
工具可能接受
要设置为活动工具的
Tool
实例序列
举个例子
# configure so that no drag tools are active
plot.toolbar.active_drag = None
# configure so that Bokeh chooses what (if any) scroll tool is active
plot.toolbar.active_scroll = "auto"
# configure so that a specific PolySelect tap tool is active
plot.toolbar.active_tap = poly_select
# configure so that a sequence of specific inspect tools are active
# note: this only works for inspect tools
plot.toolbar.active_inspect = [hover_tool, crosshair_tool]
所有这些属性的默认值为 "auto"
。
您可以通过将这些属性作为关键字参数传递给 figure()
函数来指定活动工具。也可以传递任何一个字符串名称
# configures the lasso tool to be active
plot = figure(tools="pan,lasso_select,box_select", active_drag="lasso_select")
切换工具栏自动隐藏#
要使工具栏自动隐藏,请将工具栏的 autohide
属性设置为 True。当您将 autohide
设置为 True 时,工具栏仅在鼠标位于绘图区域内时可见,否则隐藏。
from bokeh.plotting import figure, show
# Basic plot setup
plot = figure(width=400, height=400, title='Toolbar Autohide')
plot.line([1,2,3,4,5], [2,5,8,2,7])
# Set autohide to true to only show the toolbar when mouse is over plot
plot.toolbar.autohide = True
show(plot)
样式化工具叠加#
一些 Bokeh 工具也具有可配置的视觉属性。
例如,各种区域选择工具和框缩放工具都有一个 overlay
。要设置其线和填充属性的样式,请将值传递给相应的属性
import numpy as np
from bokeh.models import BoxSelectTool, BoxZoomTool, LassoSelectTool
from bokeh.plotting import figure, show
x = np.random.random(size=200)
y = np.random.random(size=200)
# Basic plot setup
plot = figure(width=400, height=400, title='Select and Zoom',
tools="box_select,box_zoom,lasso_select,reset")
plot.scatter(x, y, size=5)
select_overlay = plot.select_one(BoxSelectTool).overlay
select_overlay.fill_color = "firebrick"
select_overlay.line_color = None
zoom_overlay = plot.select_one(BoxZoomTool).overlay
zoom_overlay.line_color = "olive"
zoom_overlay.line_width = 8
zoom_overlay.line_dash = "solid"
zoom_overlay.fill_color = None
plot.select_one(LassoSelectTool).overlay.line_dash = [10, 10]
show(plot)
有关更多信息,请参见参考指南中针对 BoxSelectTool.overlay
、BoxZoomTool.overlay
、LassoSelectTool.overlay
、PolySelectTool.overlay
和 RangeTool.overlay
的条目。
平移/拖动工具#
您可以通过平移(在触摸设备上)或左拖动(在鼠标设备上)来使用这些工具。一次只能有一个平移/拖动工具处于活动状态。在适用情况下,平移/拖动工具将尊重范围上设置的任何最大值和最小值。
BoxSelectTool#
框选择工具允许您通过左拖动鼠标或在绘图区域上拖动手指来定义矩形选择区域。您可以通过将 dimensions
属性设置为 width
或 height
来配置框选择工具,以便仅在一个维度上进行选择,而不是默认的 both
。
进行选择后,选定点的索引将从图形数据源的 Selection
对象上的属性中获取。例如
source.selected.indices
将在“散点”类型图形的常见情况下保存选定的索引。
注意
要进行多个选择,请按 SHIFT 键。要清除选择,请按 ESC 键。
BoxZoomTool#
框缩放工具允许您通过左拖动鼠标或在绘图区域上拖动手指来定义一个矩形区域,将绘图边界缩放至该区域。
LassoSelectTool#
套索选择工具允许您通过左拖动鼠标或在绘图区域上拖动手指来定义一个任意选择区域。
进行选择后,选定点的索引将从图形数据源的 Selection
对象上的属性中获取。例如
source.selected.indices
将在“散点”类型图形的常见情况下保存选定的索引。
注意
要进行多次选择,请按 SHIFT 键。要清除选择,请按 ESC 键。
PanTool#
平移工具允许您通过左键拖动鼠标或在绘图区域上拖动手指来平移绘图。
您可以通过将 dimensions
属性设置为包含 width
或 height
的列表来配置平移工具,使其仅作用于 x 轴或 y 轴。此外,还有工具名称 'xpan'
和 'ypan'
,分别对应于 x 轴和 y 轴。
单击/点击工具#
在触摸设备上点击或在鼠标设备上左键单击使用这些工具。一次只能激活一个单击/点击工具。
多边形选择工具#
多边形选择工具允许您通过左键单击鼠标或在不同位置轻触手指来定义一个任意多边形区域进行选择。
进行选择后,选定点的索引将从图形数据源的 Selection
对象上的属性中获取。例如
source.selected.indices
将在“散点”类型图形的常见情况下保存选定的索引。
注意
通过在画布上按下点击来完成选择。要进行多选,请按 SHIFT 键。要清除选择,请按 ESC 键。
点击工具#
点击选择工具允许您通过单击鼠标左键或用手指轻触来选择单个点。
进行选择后,选定点的索引将从图形数据源的 Selection
对象上的属性中获取。例如
source.selected.indices
将在“散点”类型图形的常见情况下保存选定的索引。
注意
要进行多次选择,请按 SHIFT 键。要清除选择,请按 ESC 键。
滚动/捏合工具#
在触摸设备上捏合或在鼠标设备上滚动使用这些工具。一次只能激活一个滚动/捏合工具。
滚轮缩放工具#
您可以使用滚轮缩放工具放大或缩小绘图,以当前鼠标位置为中心。它会尊重任何最小值和最大值以及范围,防止放大和缩小超出这些值。
您可以通过将 dimensions
属性设置为包含 width
或 height
的列表来配置滚轮缩放工具,使其仅作用于 x 轴或 y 轴。此外,还有工具名称 'xwheel_zoom'
和 'ywheel_zoom'
,分别对应于 x 轴和 y 轴。
滚轮平移工具#
滚轮平移工具在指定维度上平移绘图窗口,而不改变窗口的纵横比。它会尊重任何最小值和最大值以及范围,防止平移超出这些值。
操作#
操作是在工具栏中的按钮被点击或轻触时才激活的操作。它们通常是模态或立即执行的。
检查工具#
名称:
'examine'
检查工具显示一个模态对话框,该对话框提供了对构成绘图的所有对象的当前属性值的视图。
注意
将来,ExamineTool
将通过上下文菜单激活,并且可用于所有对象,而不仅仅是绘图。
撤销工具#
撤销工具恢复绘图的先前状态。
重做工具#
重做工具撤销撤销工具执行的最后一次操作。
重置工具#
重置工具将绘图范围恢复到其原始值。
保存工具#
保存工具允许您保存绘图的 PNG 图片。默认情况下,会提示您输入文件名。或者,您可以自己创建工具实例并提供文件名。
SaveTool(filename='custom_filename') # png extension not needed
无论哪种方式,文件都会直接下载,或者根据您的浏览器打开一个模态对话框。
放大工具#
放大工具会增加绘图的缩放比例。它会尊重任何最小值和最大值以及范围,防止放大和缩小超出这些值。
您可以通过将 dimensions
属性设置为包含 width
或 height
的列表来配置滚轮缩放工具,使其仅作用于 x 轴或 y 轴。此外,还有工具名称 'xzoom_in'
和 'yzoom_in'
,分别对应于 x 轴和 y 轴。
缩小工具#
缩小工具会降低绘图的缩放级别。它会尊重任何最小值和最大值以及范围,防止放大和缩小超出这些值。
您可以通过将 dimensions
属性设置为包含 width
或 height
的列表来配置滚轮缩放工具,使其仅作用于 x 轴或 y 轴。此外,还有工具名称 'xzoom_in'
和 'yzoom_in'
,分别对应于 x 轴和 y 轴。
检查器#
检查器是被动工具,它们会根据当前光标位置注释或报告有关绘图的信息。多个检查器可以在任何给定时间处于活动状态。您可以在工具栏中的检查器菜单中切换检查器的活动状态。
十字线工具#
十字线工具在绘图上绘制一个十字线注释,以当前鼠标位置为中心。您可以通过将 dimensions
属性设置为 width
、height
或 both
来配置十字线工具的尺寸。
悬停工具#
悬停工具是一个被动的检查器工具。默认情况下,它始终处于打开状态,但您可以在工具栏中的检查器菜单中更改此设置。
基本工具提示#
默认情况下,悬停工具会生成一个“表格”工具提示,其中每一行包含一个标签及其关联的值。标签和值作为(label, value) 元组列表提供。例如,左侧的工具提示是使用右侧的 tooltips
定义创建的。
hover.tooltips = [
("index", "$index"),
("(x,y)", "($x, $y)"),
("radius", "@radius"),
("fill color", "$color[hex, swatch]:fill_color"),
("fill color", "$color[hex]:fill_color"),
("fill color", "$color:fill_color"),
("fill color", "$swatch:fill_color"),
("foo", "@foo"),
("bar", "@bar"),
]
|
以 $
开头的字段名称是“特殊字段”。这些字段通常对应于绘图中的一部分,例如鼠标在数据空间或屏幕空间中的坐标。这些特殊字段列在下面
$index
数据源中选定点的索引
$glyph_view
对被击中的图形视图的引用
$name
悬停图形渲染器的
name
属性的值$x
光标在数据空间中的 x 坐标
$y
光标在数据空间中的 y 坐标
$sx
光标在屏幕(画布)空间中的 x 坐标
$sy
光标在屏幕(画布)空间中的 y 坐标
$snap_x
工具提示在数据空间中锚定的 x 坐标
$snap_y
工具提示在数据空间中锚定的 y 坐标
$snap_sx
工具提示在屏幕(画布)空间中锚定的 x 坐标
$snap_sy
工具提示在屏幕(画布)空间中锚定的 y 坐标
$color
来自数据源的颜色,语法为:
$color[options]:field_name
。可用的选项有:hex
(以十六进制值显示颜色)、swatch
(来自数据源的颜色数据显示为一个小色块)。$swatch
来自数据源的颜色数据显示为一个小色块。
此外,某些图形可能会报告特定于该图形的附加数据。
$indices
数据源中所有选定点的索引
$segment_index
选定子线(仅限多线图形)的段索引
$image_index
图像数组(仅限图像图形)中的像素索引
以 @
开头的字段名与 ColumnDataSource
中的列相关联。例如,字段名 "@price"
将在触发悬停时显示 "price"
列中的值。如果悬停的是第 17 个图形实例,则悬停工具提示将显示第 17 个价格值。
请注意,如果列名包含空格,则必须用花括号将其括起来。例如,配置 @{adjusted close}
将显示名为 "adjusted close"
的列中的值。
有时,尤其是在堆叠图表中,希望能够间接指定列名。在这种情况下,使用字段名 @$name
在悬停的图形渲染器上查找 name
字段,并将该值用作列名。例如,如果您将鼠标悬停在名为 "US East"
的图形上,则 @$name
等效于 @{US East}
。
以下是如何通过将 tooltips
参数设置为 figure
来配置和使用悬停工具的完整示例。
from bokeh.models import ColumnDataSource
from bokeh.plotting import figure, show
source = ColumnDataSource(data=dict(
x=[1, 2, 3, 4, 5],
y=[2, 5, 8, 2, 7],
desc=['A', 'b', 'C', 'd', 'E'],
))
TOOLTIPS = [
("index", "$index"),
("(x,y)", "($x, $y)"),
("desc", "@desc"),
]
p = figure(width=400, height=400, tooltips=TOOLTIPS,
title="Mouse over the dots")
p.scatter('x', 'y', size=20, source=source)
show(p)
命中测试行为#
悬停工具显示与单个图形相关的工具提示。您可以使用 mode
属性以不同的方式配置这些工具提示的激活方式。
"mouse"
:仅当鼠标直接位于图形上时。
"vline"
:当从鼠标位置绘制的垂直线与图形相交时。
"hline"
:当从鼠标位置绘制的水平线与图形相交时。
默认配置为 mode = "mouse"
。在上面的 基本工具提示 示例中可以看到。下面的 格式化工具提示字段 中的示例演示了 mode = "vline"
。
格式化工具提示字段#
默认情况下,字段的值(例如 @foo
)将以基本的数字格式显示。要控制值的格式,您可以通过在花括号中附加指定的格式来修改字段。以下是一些示例。
"@foo{0,0.000}" # formats 10000.1234 as: 10,000.123
"@foo{(.00)}" # formats -10000.1234 as: (10000.123)
"@foo{($ 0.00 a)}" # formats 1230974 as: $ 1.23 m
以上示例都使用默认格式方案。您可以指定其他格式方案。
"numeral"
:为数字、货币、字节、时间和百分比提供各种格式。完整的格式集可以在
NumeralTickFormatter
参考文档中找到。"datetime"
:为日期和时间值提供格式。完整的格式集列在
DatetimeTickFormatter
参考文档中。"printf"
:提供类似于 C 语言“printf”类型说明符的格式。有关完整详细信息,请参见
PrintfTickFormatter
参考文档。
您可以通过配置悬停工具的 formatters
属性来添加这些格式。此属性将工具提示变量映射到格式方案。例如,要使用 "datetime"
方案来格式化 @{close date}"
列,请设置以下值。
hover_tool.formatters = { "@{close date}": "datetime"}
您还可以为“特殊变量”提供格式,例如 "$x"
hover_tool.formatters = { "$x": "datetime"}
如果未为列名指定格式,则假设使用默认的 "numeral"
格式。
请注意,格式规范也与包含空格的列名兼容。例如,@{adjusted close}{($ 0.00 a)}
将格式应用于名为“adjusted close”的列。
下面的示例代码配置了一个 HoverTool
,它对不同的字段使用不同的格式。
HoverTool(
tooltips=[
( 'date', '@date{%F}' ),
( 'close', '$@{adj close}{%0.2f}' ), # use @{ } for field names with spaces
( 'volume', '@volume{0.00 a}' ),
],
formatters={
'@date' : 'datetime', # use 'datetime' formatter for '@date' field
'@{adj close}' : 'printf', # use 'printf' formatter for '@{adj close}' field
# use default 'numeral' formatter for other fields
},
# display a tooltip whenever the cursor is vertically in line with a glyph
mode='vline'
)
您可以通过将鼠标悬停在下面的图上,查看此配置生成的输出。
模型 CustomJSHover
允许您使用 JavaScript 指定自定义格式器,该格式器可以在工具提示中显示派生数量。
图像悬停#
您可以使用悬停工具来检查图像图形,这些图形可能包含相应 ColumnDataSource
中的多个数据层。
import numpy as np
from bokeh.plotting import figure, show
ramp = np.array([np.linspace(0, 10, 200)]*20)
steps = np.array([np.linspace(0, 10, 10)]*20)
bitmask = np.random.rand(25, 10) > 0.5
data = dict(image=[ramp, steps, bitmask],
squared=[ramp**2, steps**2, bitmask**2],
pattern=['smooth ramp', 'steps', 'bitmask'],
x=[0, 0, 25],
y=[5, 20, 5],
dw=[20, 20, 10],
dh=[10, 10, 25])
TOOLTIPS = [
('name', "$name"),
('index', "$index"),
('pattern', '@pattern'),
("x", "$x"),
("y", "$y"),
("value", "@image"),
('squared', '@squared'),
]
p = figure(x_range=(0, 35), y_range=(0, 35), tools='hover,wheel_zoom', tooltips=TOOLTIPS)
p.image(source=data, image='image', x='x', y='y', dw='dw', dh='dh',
palette="Inferno256", name="Image Glyph")
show(p)
在此示例中,定义了三个图像模式,ramp
、steps
和 bitmask
。悬停工具提示显示图像的索引、模式的名称、光标的 x
和 y
位置,以及相应的值和值的平方。
自定义工具提示#
您可以为工具提示提供自定义 HTML 模板。为此,请传递一个 HTML 字符串,并在需要替换的地方使用 Bokeh 工具提示字段名称符号。上面有关格式的所有信息仍然适用。请注意,您也可以在列名之后使用 {safe}
格式来禁用数据源中 HTML 的转义。请参见下面的示例。
from bokeh.models import ColumnDataSource
from bokeh.plotting import figure, show
source = ColumnDataSource(data=dict(
x=[1, 2, 3, 4, 5],
y=[2, 5, 8, 2, 7],
desc=['A', 'b', 'C', 'd', 'E'],
imgs=[
'https://docs.bokeh.org.cn/static/snake.jpg',
'https://docs.bokeh.org.cn/static/snake2.png',
'https://docs.bokeh.org.cn/static/snake3D.png',
'https://docs.bokeh.org.cn/static/snake4_TheRevenge.png',
'https://docs.bokeh.org.cn/static/snakebite.jpg',
],
fonts=[
'<i>italics</i>',
'<pre>pre</pre>',
'<b>bold</b>',
'<small>small</small>',
'<del>del</del>',
],
))
TOOLTIPS = """
<div>
<div>
<img
src="@imgs" height="42" alt="@imgs" width="42"
style="float: left; margin: 0px 15px 15px 0px;"
border="2"
></img>
</div>
<div>
<span style="font-size: 17px; font-weight: bold;">@desc</span>
<span style="font-size: 15px; color: #966;">[$index]</span>
</div>
<div>
<span>@fonts{safe}</span>
</div>
<div>
<span style="font-size: 15px;">Location</span>
<span style="font-size: 10px; color: #696;">($x, $y)</span>
</div>
</div>
"""
p = figure(width=400, height=400, tooltips=TOOLTIPS,
title="Mouse over the dots")
p.scatter('x', 'y', size=20, source=source)
show(p)
另请参见
有关在 Bokeh 中使用工具提示的更多一般信息,请参见 工具提示。
编辑工具#
编辑工具通过添加、修改和删除 ColumnDataSource
数据,提供在客户端绘制和编辑图形的功能。
所有编辑工具都共享少量关键绑定。
- SHIFT
修改键,用于添加到选择或开始绘制。
- BACKSPACE
删除选定的图形。
- ESC
清除选择。
注意
在 MacBook 和某些其他键盘上,BACKSPACE 键标为“删除”。
BoxEditTool#
BoxEditTool() 允许您通过编辑底层的 ColumnDataSource
数据,在绘图上绘制、拖动和删除 Rect
图形。与其他绘图工具一样,您必须将要编辑的渲染器作为列表传递。
r1 = p.rect('x', 'y', 'width', 'height', source=source)
r2 = p.rect('x', 'y', 'width', 'height', source=source2)
tool = BoxEditTool(renderers=[r1, r2])
该工具会自动修改与图形的 x
、y
、width
和 height
值相对应的 Data Source 的列。添加新点时,Data Source 中的任何其他列都将使用它们各自的默认值填充。所有新添加的点都将插入到第一个提供的渲染器的 ColumnDataSource
中。
交互工具默认值#
列的默认值是根据以下顺序计算的。
工具的
default_overrides
,由用户提供。数据源的
default_values
,由用户提供。数据源的推断默认值,由数据源根据列的
dtype
或内容计算得出。工具的
empty_value
,由用户提供,是在无法在前面的步骤中确定合理值时使用的最后手段。
限制可以绘制的元素数量通常很有用。例如,当指定一定数量的兴趣区域时。使用 num_objects
属性,您可以确保一旦达到限制,最旧的框将从队列中弹出,以便为新添加的框腾出空间。
上面的动画显示了支持的工具操作,使用光标周围的圆圈突出显示鼠标操作,使用显示按下键的方式突出显示按键操作。 BoxEditTool
可以 添加、移动和删除绘图上的框。
- 添加框
按住 Shift 键,然后在绘图区域内任意位置单击并拖动,或点击一次开始绘制。移动鼠标并再次点击以完成绘制。
- 移动方框
单击并拖动现有方框。松开鼠标按钮后,方框将被放置。
- 删除方框
点击一个方框将其选中,然后在鼠标位于绘图区域内时按 BACKSPACE 键。
要移动或删除多个方框
- 移动选择
使用 SHIFT+点击(或其他选择工具)选择方框,然后在绘图区域内任意位置拖动。选择并拖动特定方框将同时移动两者。
- 删除选择
使用 SHIFT+点击(或其他选择工具)选择方框,然后在鼠标位于绘图区域内时按 BACKSPACE 键。
FreehandDrawTool#
通过编辑底层的 ColumnDataSource
数据,FreehandDrawTool()
允许使用 Patches
和 MultiLine
图形进行自由手绘线和多边形。与其他绘图工具一样,您必须将要编辑的渲染器作为列表传递。
r = p.multi_line('xs', 'ys' source=source)
tool = FreehandDrawTool(renderers=[r])
该工具会自动修改数据源中与图形的 xs
和 ys
值相对应的列。在添加新点时,数据源中的任何其他列都将根据 交互工具默认值 过程进行填充。任何新添加的点都将插入到第一个提供的渲染器的 ColumnDataSource
中。
限制可以绘制的元素数量通常也很有用。例如,在指定特定数量的感兴趣区域时。使用 num_objects
属性,您可以确保一旦达到限制,最旧的补丁/多线将从队列中弹出,为新添加的补丁/多线腾出空间。
上面的动画显示了支持的工具操作,突出显示了鼠标操作,在光标周围用圆圈表示,并通过显示按下的键来表示按键。
- 绘制补丁/多线
单击并拖动以开始绘制,然后释放鼠标按钮以完成绘制。
- 删除补丁/多线
点击一条线或一个补丁以将其选中,然后在鼠标位于绘图区域内时按 BACKSPACE 键。
要删除多个补丁/线条
- 删除选择
使用 SHIFT+点击(或其他选择工具)选择补丁/线条,然后在鼠标位于绘图区域内时按 BACKSPACE 键。
PointDrawTool#
通过编辑底层的 ColumnDataSource
数据,PointDrawTool()
允许您在一个或多个渲染器上添加、拖动和删除点状图形(XYGlyph
类型)。与其他绘图工具一样,您必须将要编辑的渲染器作为列表传递。
c1 = p.circle('x', 'y', 'width', 'height', source=source)
r1 = p.rect('x', 'y', 0.1, 0.1, source=source2)
tool = PointDrawTool(renderers=[c1, r1])
该工具会自动修改数据源中与图形的 x
和 y
值相对应的列。在添加新点时,数据源中的任何其他列都将根据 交互工具默认值 过程进行填充。任何新添加的点都将插入到第一个提供的渲染器的 ColumnDataSource
中。
限制可以绘制的元素数量通常也很有用。使用 num_objects
属性,您可以确保一旦达到限制,最旧的点将从队列中弹出,为新添加的点腾出空间。
上面的动画显示了支持的工具操作,突出显示了鼠标操作,在光标周围用圆圈表示,并通过显示按下的键来表示按键。The PointDrawTool 可以添加、移动和删除绘图上的点状图形。
- 添加点
在绘图区域的任意位置点击。
- 移动点
点击并拖动现有点。松开鼠标按钮后,点将被放置。
- 删除点
点击一个点将其选中,然后在鼠标位于绘图区域内时按 BACKSPACE 键。
要移动或删除多个点
- 移动选择
使用 SHIFT+点击(或其他选择工具)选择点,然后在绘图区域内任意位置拖动。选择并拖动特定点将同时移动两者。
- 删除选择
使用 SHIFT+点击(或其他选择工具)选择点,然后在鼠标位于绘图区域内时按 BACKSPACE 键。
PolyDrawTool#
通过编辑底层的 ColumnDataSource
数据,PolyDrawTool()
允许您在一个或多个渲染器上绘制、选择和删除 Patches
和 MultiLine
图形。与其他绘图工具一样,您必须将要编辑的渲染器作为列表传递。
该工具会自动修改数据源中与图形的 xs
和 ys
值相对应的列。在添加新点时,数据源中的任何其他列都将根据 交互工具默认值 过程进行填充。任何新添加的补丁或多线都将插入到第一个提供的渲染器的 ColumnDataSource
中。
限制可以绘制的元素数量通常也很有用。例如,在指定特定数量的感兴趣区域时。使用 num_objects
属性,您可以确保一旦达到限制,最旧的补丁/多线将从队列中弹出,为新添加的补丁/多线腾出空间。
如果提供了具有点状图形的 vertex_renderer
,PolyDrawTool 将使用它来显示所有提供的渲染器上的多线/补丁的顶点。这也使得在绘制时可以捕捉到现有的顶点。
上面的动画显示了支持的工具操作,突出显示了鼠标操作,在光标周围用圆圈表示,并通过显示按下的键来表示按键。The PolyDrawTool 可以添加、移动和删除补丁和多线。
- 添加补丁/多线
点击添加第一个顶点,然后使用点击添加每个后续顶点。要完成绘制操作,点击插入最后一个顶点或按 ESC 键。
- 移动补丁/多线
点击并拖动现有补丁/多线。松开鼠标按钮后,点将被放置。
- 删除补丁/多线
点击一个补丁/多线以将其选中,然后在鼠标位于绘图区域内时按 BACKSPACE 键。
PolyEditTool#
PolyEditTool() 允许您编辑一个或多个 Patches
或 MultiLine
图形的顶点。您可以使用 renderers
属性定义要编辑的图形。您可以使用 vertex_renderer
定义顶点的渲染器。它必须渲染一个点状图形(XYGlyph
类型)。
该工具会自动修改数据源中与图形的 xs
和 ys
值相对应的列。在添加新点时,数据源中的任何其他列都将根据 交互工具默认值 过程进行填充。
上面的动画显示了支持的工具操作,突出显示了鼠标操作,在光标周围用圆圈表示,并通过显示按下的键来表示按键。The PolyEditTool 可以添加、移动和删除现有补丁和多线上的顶点。
- 显示顶点
点击现有补丁或多线。
- 添加顶点
点击现有顶点以将其选中。该工具将绘制下一个点。要添加它,请点击新的位置。要完成编辑并添加一个点,请点击。否则请按 ESC 键取消。
- 移动顶点
拖动现有顶点,然后松开鼠标按钮将其释放。
- 删除顶点
选择一个或多个顶点后,在鼠标光标位于绘图区域内时按 BACKSPACE 键。
控制细节级别#
尽管 HTML 画布可以舒适地显示数十万甚至数百万个图形,但这样做会对交互性能产生不利影响。为了适应大型数据规模,Bokeh 绘图在客户端提供了“细节级别”(LOD)功能。
注意
处理超大量数据时的另一种选择是在数据发送到浏览器之前使用 Bokeh 服务器对数据进行下采样。在一定的数据规模之后,这种方法是不可避免的。有关更多信息,请参阅 Bokeh 服务器。
为了在处理大型数据规模时保持性能,绘图仅在交互操作(例如平移或缩放)期间绘制一小部分数据点。在 Plot
对象上,有四个属性控制 LOD 行为。