Tkinter中用FigureCanvasTkAgg绘制多子图时滚动卡顿问题求助

核心问题 #

使用FigureCanvasTkAgg绘制36个子图时，Tkinter滚动条滚动过程中出现严重卡顿，影响用户体验。

复现代码 #

import numpy as np
import matplotlib.pyplot as plt
from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg
import tkinter as tk

class App:
    def __init__(self, root):
        self.root = root
        self.root.title("Scrollable Matplotlib Plot with 36 Subplots")

        # 创建画布和滚动条容器
        frame = tk.Frame(root)
        frame.pack(fill=tk.BOTH, expand=True)

        self.canvas = tk.Canvas(frame)
        self.canvas.pack(side=tk.LEFT, fill=tk.BOTH, expand=True)

        # 垂直滚动条
        self.v_scrollbar = tk.Scrollbar(frame, orient=tk.VERTICAL, command=self.canvas.yview)
        self.v_scrollbar.pack(side=tk.RIGHT, fill=tk.Y)

        # 水平滚动条
        self.h_scrollbar = tk.Scrollbar(root, orient=tk.HORIZONTAL, command=self.canvas.xview)
        self.h_scrollbar.pack(side=tk.BOTTOM, fill=tk.X)

        self.canvas.configure(yscrollcommand=self.v_scrollbar.set)
        self.canvas.configure(xscrollcommand=self.h_scrollbar.set)

        # 创建36个子图
        self.fig, self.axs = plt.subplots(6, 6, figsize=(10, 10))

        # 生成数据并绘图
        x = np.linspace(0, 10, 100)
        for i, ax in enumerate(self.axs.flat):
            ax.plot(x, np.sin(x + i), label=f'Sine Wave {i+1}')
            ax.set_title(f'Plot {i+1}')
            ax.legend()

        # 将Matplotlib图添加到Tk画布
        self.figure_canvas = FigureCanvasTkAgg(self.fig, master=self.canvas)
        self.figure_canvas.get_tk_widget().pack(fill=tk.BOTH, expand=True)

        self.canvas.create_window((0, 0), window=self.figure_canvas.get_tk_widget(), anchor='nw')
        self.update_scroll_region()
        self.root.bind("<Configure>", self.on_resize)

    def update_scroll_region(self):
        self.canvas.configure(scrollregion=self.canvas.bbox("all"))

    def on_resize(self, event):
        self.update_scroll_region()

root = tk.Tk()
app = App(root)
root.mainloop()

解决方案 #

1. 优化Matplotlib渲染性能 #

减少不必要的渲染元素，降低绘图复杂度：

• 简化子图元素：去掉非必需的图例、缩小标题字体
• 使用更高效的绘图方式：减小线条宽度，避免冗余样式
• 关闭坐标轴交互式功能（如果不需要）

修改后的绘图代码示例：

x = np.linspace(0, 10, 100)
for i, ax in enumerate(self.axs.flat):
    # 简化绘图，去掉图例，缩小标题字体
    ax.plot(x, np.sin(x + i), linewidth=1)
    ax.set_title(f'Plot {i+1}', fontsize=8)
    # 关闭坐标轴交互
    ax.set_navigate(False)
# 调整子图间距，减少空白区域
self.fig.tight_layout(pad=0.5)

2. 将Matplotlib图渲染为图片后再放入Tk画布 #

滚动卡顿的核心原因是滚动时Matplotlib需要实时渲染整个Figure。改为先将Figure渲染成Tkinter的PhotoImage，再在Canvas上显示图片，滚动时仅移动图片像素，大幅提升流畅度：

修改后的核心代码：

class App:
    def __init__(self, root):
        self.root = root
        self.root.title("Scrollable Matplotlib Image")

        # 滚动条和画布设置同原代码...

        # 创建子图并绘图（同优化后的代码）
        self.fig, self.axs = plt.subplots(6, 6, figsize=(10, 10), dpi=100)
        x = np.linspace(0, 10, 100)
        for i, ax in enumerate(self.axs.flat):
            ax.plot(x, np.sin(x + i), linewidth=1)
            ax.set_title(f'Plot {i+1}', fontsize=8)
            ax.set_navigate(False)
        self.fig.tight_layout(pad=0.5)

        # 将Figure渲染为Tk PhotoImage
        self.fig.canvas.draw()
        buf = self.fig.canvas.tostring_rgb()
        width, height = self.fig.canvas.get_width_height()
        self.photo = tk.PhotoImage(width=width, height=height, data=buf, format='PPM')

        # 在Canvas上显示图片
        self.canvas_image = self.canvas.create_image(0, 0, image=self.photo, anchor='nw')
        self.update_scroll_region()
        self.root.bind("<Configure>", self.on_resize)

    # update_scroll_region和on_resize方法同原代码...

3. 调整Figure的尺寸和DPI #

减小Figure的figsize和dpi，降低整体像素数量，减少渲染压力：

# 调整为更小的尺寸和DPI
self.fig, self.axs = plt.subplots(6, 6, figsize=(8, 8), dpi=90)

4. 按需渲染（进阶方案） #

只渲染当前可见区域的子图，滚动时动态更新可见区域的内容。思路是监听滚动事件，计算可见区域范围，仅绘制该区域内的子图，其余区域用空白占位。该方案实现复杂，但能最大化性能，适合超大量子图场景。

内容的提问来源于stack exchange，提问作者chews