如何在Matplotlib交互式绘图中实现点的垂直拖拽功能？

你说得对，直接拖拽点调整位置的交互体验确实比滑块顺手太多！结合你提到的Poly Editor示例，咱们可以用Matplotlib的事件处理系统（通过mpl_connect绑定鼠标事件）来实现这个需求，核心就是监听鼠标的按下、移动、释放三个关键事件，实现“选中点→垂直拖拽→实时更新样条”的完整流程。

完整实现代码 #

我把你原来的代码修改成了拖拽版本，保留了样条拟合的核心逻辑，替换滑块为拖拽交互：

import matplotlib as mpl
from matplotlib import pyplot as plt
import scipy.interpolate as inter
import numpy as np

func = lambda x: 0.1*x**2
N = 10
xmin = 0
xmax = 10
x = np.linspace(xmin, xmax, N)
yvals = func(x)
spline = inter.InterpolatedUnivariateSpline(x, yvals)

# 设置绘图布局
mpl.rcParams['figure.subplot.right'] = 0.8
fig, ax1 = plt.subplots(1, 1, figsize=(9.0, 8.0), sharex=True)

X = np.arange(0, xmax+1, 0.1)
ax1.plot(X, func(X), 'k--', label='original')
# 保存点的Line2D对象，方便后续更新
point_plot, = ax1.plot(x, yvals, color='k', linestyle='none', marker='o', markersize=8, picker=5)  # picker设置选中阈值（像素）
spline_plot, = ax1.plot(X, spline(X), 'r-', label='spline')

ax1.set_yscale('linear')
ax1.set_xlim(0, xmax)
ax1.set_ylim(0, xmax)
ax1.set_xlabel('x')
ax1.set_ylabel('y')
ax1.grid(True)
ax1.yaxis.grid(True, which='minor', linestyle='--')
ax1.legend(loc=2, prop={'size':22})

# 用于记录选中的点和初始状态
selected_point = None
initial_y = None

def on_press(event):
    global selected_point, initial_y
    # 只处理当前坐标轴内的点击
    if event.inaxes != ax1:
        return
    # 获取被点击的点的索引
    contains, ind = point_plot.contains(event)
    if contains:
        selected_point = ind['ind'][0]  # 取第一个选中的点（避免多点重叠）
        initial_y = yvals[selected_point]

def on_motion(event):
    global selected_point, initial_y
    if selected_point is None or event.inaxes != ax1:
        return
    # 计算鼠标移动的垂直偏移（转换为数据坐标）
    dy = event.ydata - initial_y
    # 更新选中点的y值，x值保持不变
    yvals[selected_point] = initial_y + dy
    # 更新点的显示
    point_plot.set_ydata(yvals)
    # 重新拟合样条并更新曲线
    new_spline = inter.InterpolatedUnivariateSpline(x, yvals)
    spline_plot.set_ydata(new_spline(X))
    # 刷新画布
    fig.canvas.draw_idle()

def on_release(event):
    global selected_point, initial_y
    selected_point = None
    initial_y = None

# 绑定事件
fig.canvas.mpl_connect('button_press_event', on_press)
fig.canvas.mpl_connect('motion_notify_event', on_motion)
fig.canvas.mpl_connect('button_release_event', on_release)

plt.show()

关键逻辑解释 #

1. 点的选中机制：给点的plot函数加上picker=5参数，意思是鼠标点击距离点5像素范围内就算选中。在on_press事件里用contains方法判断是否点击到了点，拿到选中点的索引。
2. 垂直拖拽限制：拖拽时只更新点的y坐标，x坐标保持初始值不变，完全符合你要的垂直拖拽需求。
3. 实时更新样条：每次鼠标移动时，重新拟合InterpolatedUnivariateSpline，并更新样条曲线的ydata，最后调用draw_idle()高效刷新画布。
4. 事件生命周期：按下鼠标时记录选中状态和初始y值，移动时更新数据，释放鼠标时清空选中状态，逻辑清晰完整。

这个实现完全借鉴了你提到的Poly Editor的交互思路，适配成了仅垂直拖拽控制点的场景，用户体验比滑块流畅很多！

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