通用视觉属性#

要样式化 Bokeh 绘图的视觉属性,您需要了解可用的属性有哪些。完整的参考指南包含每个对象的全部属性。但是,许多对象都有三个共同的属性组。它们是

  • 线条属性:线条颜色、宽度等。

  • 填充属性:填充颜色、alpha 值等。

  • 文本属性:字体样式、颜色等。

本节包含关于一些最常用属性的更多细节。

线条属性#

line_color

用于描边线条的颜色

line_width

线条描边宽度,单位为像素

line_alpha

介于 0(透明)和 1(不透明)之间的浮点数

line_join

路径段应如何连接在一起

  • 'miter' miter_join

  • 'round' round_join

  • 'bevel' bevel_join

line_cap

路径段应如何终止

  • 'butt' butt_cap

  • 'round' round_cap

  • 'square' square_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

" "

blank

dot

"."

dot

ring

"o"

ring

horizontal_line

"-"

horizontal_line

vertical_line

"|"

vertical_line

cross

"+"

cross

horizontal_dash

'"'

horizontal_dash

vertical_dash

":"

vertical_dash

spiral

"@"

spiral

right_diagonal_line

"/"

right_diagonal_line

left_diagonal_line

"\\"

left_diagonal_line

diagonal_cross

"x"

diagonal_cross

right_diagonal_dash

","

right_diagonal_dash

left_diagonal_dash

"`"

left_diagonal_dash

horizontal_wave

"v"

horizontal_wave

vertical_wave

">"

vertical_wave

criss_cross

"*"

criss_cross

hatch_extra

一个字典,将字符串名称映射到自定义图案实现。名称可以通过 hatch_pattern 引用。例如,如果为 hatch_extra 设置了以下值

hatch_extra={ 'mycustom': ImageURLTexture(url=...) }

那么名称 "mycustom" 可以设置为 hatch_pattern

文本属性#

text_font

字体名称,例如 'times''helvetica'

text_font_size

字体大小,单位为pxempt,例如 '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)(其中 rgb 是介于 0 和 255 之间的整数)。

  • (r, g, b, a) 的 4 元组(其中 rgb 是介于 0 和 255 之间的整数,a 是介于 0 和 1 之间的浮点值)。

  • 32 位无符号整数,表示 0xRRGGBBAA 字节顺序模式的 RGBA 值,例如 0xffff00ff0xff0000ff

要定义一系列颜色,请使用颜色数据数组,例如列表或 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_alphafill_alpha 属性单独设置 alpha 值。

如果您在指定带有 alpha 值的颜色的同时,还通过 line_alphafill_alpha 属性显式提供 alpha 值,则 alpha 值将通过将它们相乘来组合。例如,如果您的颜色是 '#00FF0044''rgba(255, 0, 127, 0.6)',并且您的单独 alpha 值为 0.5,则用于字形的 alpha 值将为 0.6*0.5 = 0.3

下图演示了 RGB 和 RGBA 颜色与 line_alphafill_alpha 属性结合使用的每种可能的组合

注意

如果您使用Bokeh 的绘图接口,您还可以选择在调用渲染器方法时将 color 和/或 alpha 指定为关键字。Bokeh 会自动将这些值应用于字形的相应 fillline 属性。

您仍然可以选择提供额外的 fill_colorfill_alphaline_colorline_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'