通用视觉属性#

要为Bokeh图表的视觉属性设置样式，您需要了解可用的属性有哪些。完整的参考指南包含了每个对象的所有属性。然而，许多对象共有三组属性。它们是：

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

  • 填充属性: 填充颜色, 透明度, 等.

  • 文本属性: 字体样式, 颜色等.

本节包含了一些最常见属性的更多详细信息。

线条属性#

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中提供的模式的字符串名称。内置模式有：

Built-in Hatch Patterns#

全名

缩写

Example

空白

" "

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

"@"

螺旋

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

字体大小以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属性。使用此属性来打开或关闭它们。

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'（不包含透明度信息）或 '#44444444'（包含透明度信息）。

  • 一个CSS4 rgb(), rgba(), 或 hsl() 颜色字符串, 例如 'rgb(0 127 0 / 1.0)', 'rgba(255, 0, 127, 0.6)', 或 'hsl(60deg 100% 50% / 1.0)'.

  • 一个由三个整数组成的元组 (r, g, b)（其中 r、g 和 b 是介于 0 和 255 之间的整数）。

  • 一个由 (r, g, b, a) 组成的四元组（其中 r、g 和 b 是介于 0 到 255 之间的整数，a 是介于 0 到 1 之间的浮点值）。

  • 一个32位无符号整数，表示RGBA值，采用0xRRGGBBAA字节顺序模式，例如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像素乘400像素的图表为例，x轴和y轴的范围从0到10。一个宽度和高度为图表五分之一的符号将具有80个屏幕单位或2个数据空间单位的大小。

在Bokeh中，支持屏幕单位和数据空间单位的对象通常有一个专门的属性来选择使用哪种单位。这个单位设置属性是属性名称加上_units。例如：一个Whisker annotation具有upper属性。要定义使用哪个单位，将upper_units属性设置为'screen'或'data'。