图像和栅格数据

您可以使用 image() 和 image_rgba() 字形方法在 Bokeh 图表上显示 2D 图像数组。您可以将悬停工具提示与图像字形一起使用，以便用户查看每个像素的值。有关如何为图像启用悬停工具提示的更多信息，请参阅 图像悬停。

原始 RGBA 数据

以下示例展示了如何使用 image_rgba() 方法显示使用原始 RGBA 数据的图像。

import numpy as np

from bokeh.plotting import figure, show

N = 20
img = np.empty((N,N), dtype=np.uint32)
view = img.view(dtype=np.uint8).reshape((N, N, 4))
for i in range(N):
    for j in range(N):
        view[i, j, 0] = int(i/N*255)
        view[i, j, 1] = 158
        view[i, j, 2] = int(j/N*255)
        view[i, j, 3] = 255

p = figure(width=400, height=400)
p.x_range.range_padding = p.y_range.range_padding = 0

# must give a vector of images
p.image_rgba(image=[img], x=0, y=0, dw=10, dh=10)

show(p)

颜色映射图像

以下示例展示了如何提供标量值数组，并让 Bokeh 使用 image() 字形方法在浏览器中自动对数据进行颜色映射。

import numpy as np

from bokeh.plotting import figure, show

x = np.linspace(0, 10, 300)
y = np.linspace(0, 10, 300)
xx, yy = np.meshgrid(x, y)
d = np.sin(xx) * np.cos(yy)

p = figure(width=400, height=400)
p.x_range.range_padding = p.y_range.range_padding = 0

# must give a vector of image data for image parameter
p.image(image=[d], x=0, y=0, dw=10, dh=10, palette="Sunset11", level="image")
p.grid.grid_line_width = 0.5

show(p)

请注意，此示例将渲染级别设置为 "image"。通常，Bokeh 在网格线上方绘制所有字形，但是使用此渲染级别，它们将出现在网格线下方。

原点和锚点

image() 和 image_rgba() 字形提供了 origin 和 anchor 属性，用于控制图像的相对位置和方向。

绘制时，图像将覆盖大小为 dw 乘以 dh 的矩形绘图区域。

anchor 属性指定矩形绘图区域相对于字形坐标 x 和 y 的位置。它可用于在垂直或水平方向上将图像从 x 和 y 移动。

origin 属性指定矩形绘图区域的哪个角对应于图像数组的 [0, 0] 像素。它可用于在其绘图区域内垂直或水平翻转图像。

下面的示例允许您探索简单 2x2 图像的 anchor 和 origin 的所有不同组合。