通用视觉属性#
要样式化 Bokeh 绘图的视觉属性,您需要了解可用的属性有哪些。完整的参考指南包含每个对象的全部属性。但是,许多对象都有三个共同的属性组。它们是
线条属性:线条颜色、宽度等。
填充属性:填充颜色、alpha 值等。
文本属性:字体样式、颜色等。
本节包含关于一些最常用属性的更多细节。
线条属性#
line_color用于描边线条的颜色
line_width线条描边宽度,单位为像素
line_alpha介于 0(透明)和 1(不透明)之间的浮点数
line_join路径段应如何连接在一起
line_cap路径段应如何终止
line_dash要使用的线条样式
'solid''dashed''dotted''dotdash''dashdot'描述要使用的虚线开-关模式的整数像素距离数组
一个空格分隔的整数字符串,匹配正则表达式
'^(\\d+(\\s+\\d+)*)?$',描述要使用的虚线开-关模式
line_dash_offset图案应从
line_dash中开始的像素距离
填充属性#
fill_color用于填充路径的颜色
fill_alpha介于 0(透明)和 1(不透明)之间的浮点数
阴影线属性#
hatch_color用于描边阴影线图案的颜色
hatch_alpha介于 0(透明)和 1(不透明)之间的浮点数
hatch_weight线条描边宽度,单位为像素
hatch_scale图案“大小”的大致度量。此值具有不同的特定含义,具体取决于图案。
hatch_pattern内置图案的字符串名称(或缩写),或在
hatch_extra中提供的图案的字符串名称。内置图案包括内置阴影线图案# 全名
缩写
示例
blank" "dot"."ring"o"horizontal_line"-"vertical_line"|"cross"+"horizontal_dash'"'vertical_dash":"spiral"@"right_diagonal_line"/"left_diagonal_line"\\"diagonal_cross"x"right_diagonal_dash","left_diagonal_dash"`"horizontal_wave"v"vertical_wave">"criss_cross"*"hatch_extra一个字典,将字符串名称映射到自定义图案实现。名称可以通过
hatch_pattern引用。例如,如果为hatch_extra设置了以下值hatch_extra={ 'mycustom': ImageURLTexture(url=...) }
那么名称
"mycustom"可以设置为hatch_pattern。
文本属性#
text_font字体名称,例如
'times'、'helvetica'text_font_size字体大小,单位为px、em 或 pt,例如
'16px'、'1.5em'text_font_style要使用的字体样式
'normal'正常文本'italic'斜体文本'bold'粗体文本
text_color用于渲染文本的颜色
text_outline_color用于为文本提供描边轮廓的颜色
text_alpha介于 0(透明)和 1(不透明)之间的浮点数
text_align文本的水平锚点:
'left'、'right'、'center'text_baseline文本的垂直锚点
'top''middle''bottom''alphabetic''hanging'
注意
目前仅支持为文本提供轮廓颜色。更高级的文本描边轮廓控制界面尚未公开。
Visible 属性#
字形渲染器、坐标轴、网格和注解都具有 visible 属性。使用此属性可以打开和关闭它们。
from bokeh.plotting import figure, show
# We set-up a standard figure with two lines
p = figure(width=500, height=200, tools='')
visible_line = p.line([1, 2, 3], [1, 2, 1], line_color="blue")
invisible_line = p.line([1, 2, 3], [2, 1, 2], line_color="pink")
# We hide the xaxis, the xgrid lines, and the pink line
invisible_line.visible = False
p.xaxis.visible = False
p.xgrid.visible = False
show(p)
这在带有 Bokeh 服务器或 CustomJS 的交互式示例中尤其有用。
from bokeh.layouts import layout
from bokeh.models import BoxAnnotation, Toggle
from bokeh.plotting import figure, show
p = figure(width=600, height=200, tools='')
p.line([1, 2, 3], [1, 2, 1], line_color="#0072B2")
pink_line = p.line([1, 2, 3], [2, 1, 2], line_color="#CC79A7")
green_box = BoxAnnotation(left=1.5, right=2.5, fill_color='#009E73', fill_alpha=0.1)
p.add_layout(green_box)
# Use js_link to connect button active property to glyph visible property
toggle1 = Toggle(label="Green Box", button_type="success", active=True)
toggle1.js_link('active', green_box, 'visible')
toggle2 = Toggle(label="Pink Line", button_type="success", active=True)
toggle2.js_link('active', pink_line, 'visible')
show(layout([p], [toggle1, toggle2]))
颜色属性#
Bokeh 对象有几个与颜色相关的属性。使用这些颜色属性可以控制线条、填充或文本等的外观。
使用以下选项之一在 Bokeh 中定义颜色
任何命名的 CSS 颜色,例如
'green'或'indigo'。您还可以使用额外的名称'transparent'(等于'#00000000')。RGB(A) 十六进制值,例如
'#FF0000'(不带 alpha 信息)或'#44444444'(带 alpha 信息)。CSS4
rgb()、rgba()或hsl()颜色字符串,例如'rgb(0 127 0 / 1.0)'、'rgba(255, 0, 127, 0.6)'或'hsl(60deg 100% 50% / 1.0)'。整数的 3 元组
(r, g, b)(其中 r、g 和 b 是介于 0 和 255 之间的整数)。(r, g, b, a)的 4 元组(其中 r、g 和 b 是介于 0 和 255 之间的整数,a 是介于 0 和 1 之间的浮点值)。32 位无符号整数,表示 0xRRGGBBAA 字节顺序模式的 RGBA 值,例如
0xffff00ff或0xff0000ff。
要定义一系列颜色,请使用颜色数据数组,例如列表或 ColumnDataSource 的列。这也包括 NumPy 数组。
例如
import numpy as np
from bokeh.plotting import figure, show
x = [1, 2, 3]
y1 = [1, 4, 2]
y2 = [2, 1, 4]
y3 = [4, 3, 2]
# use a single RGBA color
single_color = (255, 0, 0, 0.5)
# use a list of different colors
list_of_colors = [
"hsl(60deg 100% 50% / 1.0)",
"rgba(0, 0, 255, 0.9)",
"LightSeaGreen",
]
# use a series of color values as numpy array
numpy_array_of_colors = np.array(
[
0xFFFF00FF,
0x00FF00FF,
0xFF000088,
],
np.uint32,
)
p = figure(title="Specifying colors")
# add glyphs to plot
p.line(x, y1, line_color=single_color)
p.circle(x, y2, radius=0.12, color=list_of_colors)
p.scatter(x, y3, size=30, marker="triangle", fill_color=numpy_array_of_colors)
show(p)
除了在定义颜色本身时指定颜色的 alpha 值外,您还可以使用字形的 line_alpha 或 fill_alpha 属性单独设置 alpha 值。
如果您在指定带有 alpha 值的颜色的同时,还通过 line_alpha 或 fill_alpha 属性显式提供 alpha 值,则 alpha 值将通过将它们相乘来组合。例如,如果您的颜色是 '#00FF0044' 或 'rgba(255, 0, 127, 0.6)',并且您的单独 alpha 值为 0.5,则用于字形的 alpha 值将为 0.6*0.5 = 0.3。
下图演示了 RGB 和 RGBA 颜色与 line_alpha 或 fill_alpha 属性结合使用的每种可能的组合
注意
如果您使用Bokeh 的绘图接口,您还可以选择在调用渲染器方法时将 color 和/或 alpha 指定为关键字。Bokeh 会自动将这些值应用于字形的相应 fill 和 line 属性。
您仍然可以选择提供额外的 fill_color、fill_alpha、line_color 和 line_alpha 参数。在这种情况下,前者将优先。
调色板#
Bokeh 提供了许多预定义的调色板,您可以参考这些调色板来定义颜色,包括用于颜色映射。
Bokeh 的预定义调色板是 RGB(A) 十六进制字符串序列。这些序列可以是列表或元组。
要使用其中一个预定义的调色板,请从 bokeh.palettes 模块导入它。
例如,当您导入 "Spectral6" 时,Bokeh 会让您访问一个列表,其中包含来自 Brewer "Spectral" 颜色映射的六个 RGB(A) 十六进制字符串
>>> from bokeh.palettes import Spectral6
>>> Spectral6
['#3288bd', '#99d594', '#e6f598', '#fee08b', '#fc8d59', '#d53e4f']
有关 Bokeh 中包含的所有标准调色板的列表,请参阅 bokeh.palettes。
屏幕单位和数据空间单位#
设置 Bokeh 对象的视觉属性时,您可以使用屏幕单位或数据空间单位
屏幕单位使用原始像素数来指定高度或宽度
数据空间单位相对于绘图的数据和坐标轴
例如,以一个 400 像素 x 400 像素的图形为例,其 x 轴和 y 轴范围为 0 到 10。一个字形的宽度和高度为图形的五分之一,则其大小为 80 个屏幕单位或 2 个数据空间单位。
Bokeh 中同时支持屏幕单位和数据空间单位的对象通常具有专用属性来选择要使用的单位。此单位设置属性是属性的名称,并添加了 _units。例如:Whisker 注解 具有属性 upper。要定义要使用的单位,请将 upper_units 属性设置为 'screen' 或 'data'。






















