概述

Bokeh是一个用于创建交互式可视化的Python库，特别适合在Web浏览器中展示。它能够生成各种类型的图表，并且支持高度交互性，如平移、缩放、选择、悬停提示等。以下是一个简单的Bokeh示例，展示如何创建一个带有交互功能的折线图。

1 认识Bokeh

1.1 Bokeh介绍

Bokeh 是一个强大的交互式可视化库，专为现代 Web 浏览器设计。它支持创建高性能、可交互的图表和仪表盘，适用于大规模数据集。

核心优势：

交互性强：支持平移、缩放、悬停提示、选择等

输出灵活：生成 HTML 文件、嵌入 Jupyter Notebook 或部署为 Web 应用

流式数据支持：实时更新图表（如金融数据流）

多种渲染器：Canvas、SVG、WebGL 支持

1.2 安装Bokeh

官方网站地址：

https://docs.bokeh.org/en/latest/index.html#

打开网站其页面如下，目前其最新版本已经更新至：v3.7.3

该packet对Python要求其版本必须升级至Python 3.10，安装命令源代码：

pip install bokeh

1.3 范例介绍

官网提供了许多冠以Bokeh的使用案例，程序员可参考这些Demo实现自己感兴趣的功能，基础案例如下：

2 Bokeh的应用

2.1 Bokeh应用的框架结构

2.2 实时性数据核心原理

实时数据可视化核心原理，Bokeh 通过 ColumnDataSource 和回调机制实现实时数据更新：

数据源对象：ColumnDataSource 存储可视化数据

流式更新：stream() 方法增量添加新数据

回调函数：周期性更新数据源

Bokeh 服务器：维护应用状态和处理实时更新

3 具体案例

3.1 代码实现

应用Bokeh模拟传感器实时更新数据的特性

#!/usr/bin/env python3
# -*- coding: utf-8 -*-
# @Time    : 2020/4/9 13:05
# @Author  : ming fei.tang
# @File    : debug tools
# ---------------------
from bokeh.plotting import figure, curdoc
from bokeh.models import ColumnDataSource, Range1d, HoverTool
from bokeh.layouts import column
from bokeh.models.widgets import Div
import random
import datetime
import numpy as np# 创建数据源
source = ColumnDataSource(data={'time': [],'temperature': [],'humidity': []
})# 创建图表
temp_plot = figure(title='温度传感器实时数据',x_axis_type='datetime',width=1000, height=300,tools="pan,wheel_zoom,box_zoom,reset"
)
temp_plot.line('time', 'temperature', source=source, line_width=2, color='red', legend_label="温度(℃)")
temp_plot.y_range = Range1d(15, 35)humidity_plot = figure(title='湿度传感器实时数据',x_axis_type='datetime',width=1000, height=300,x_range=temp_plot.x_range  # 共享X轴范围
)
humidity_plot.line('time', 'humidity', source=source, line_width=2, color='blue', legend_label="湿度(%)")
humidity_plot.y_range = Range1d(0, 100)# 状态面板
stats_div = Div(text="<h3>传感器状态: <span style='color:green'>运行中</span></h3>", width=200)# 模拟数据生成
def generate_sensor_data():current_time = datetime.datetime.now()# 模拟温度（带有小幅波动）base_temp = 25 + 5 * np.sin(current_time.minute / 30 * np.pi)temperature = base_temp + random.uniform(-0.5, 0.5)# 模拟湿度（与温度反向变化）humidity = 50 - 0.8 * (temperature - 25) + random.uniform(-2, 2)return {'time': [current_time],'temperature': [temperature],'humidity': [max(0, min(100, humidity))]  # 限制在0-100范围}# 更新函数
def update():new_data = generate_sensor_data()# 流式更新source.stream(new_data, rollover=300)  # 保留300个最新数据点# 更新状态面板stats_div.text = f"""<div style="background:#f9f9f9; padding:10px; border-radius:5px"><h3>传感器状态: <span style='color:green'>✓ 运行中</span></h3><p>最后更新时间: {datetime.datetime.now().strftime('%H:%M:%S')}</p><p>当前温度: <b>{new_data['temperature'][0]:.1f}℃</b></p><p>当前湿度: <b>{new_data['humidity'][0]:.1f}%</b></p><p>数据点数: {len(source.data['time'])}</p></div>"""# 添加悬停工具
hover = HoverTool(tooltips=[("时间", "@time{%F %T}"),("温度", "@temperature{0.0}℃"),("湿度", "@humidity{0}%")
], formatters={'@time': 'datetime'})temp_plot.add_tools(hover)# 设置布局和更新频率
layout = column(stats_div, temp_plot, humidity_plot)
curdoc().add_root(layout)
curdoc().add_periodic_callback(update, 1000)  # 每秒更新一次
curdoc().title = "实时传感器监控"