AI人体骨骼检测二次开发：自定义可视化样式修改教程

AI人体骨骼检测二次开发：自定义可视化样式修改教程

1. 背景与需求分析

随着AI在健身、动作捕捉、虚拟试衣等领域的广泛应用，人体骨骼关键点检测已成为一项基础且关键的技术能力。Google的MediaPipe Pose模型凭借其高精度、低延迟和轻量化特性，成为众多开发者首选的解决方案。

然而，在实际项目中，标准的“红点+白线”火柴人骨架图往往难以满足产品化需求。例如： - 健身App需要更炫酷的动态骨骼动画 - 教学系统希望用不同颜色区分左右肢体 - AR应用要求骨骼线具备透明度或虚线效果

因此，如何对MediaPipe的默认可视化样式进行深度定制与二次开发，就成为了提升用户体验的关键一步。

本文将基于一个已集成WebUI的MediaPipe Pose本地镜像环境，手把手教你如何修改骨骼关键点与连接线的颜色、粗细、形状、可见性等视觉属性，实现个性化骨骼渲染。

2. 技术架构与核心组件解析

2.1 系统整体结构

本项目采用前后端分离架构：

[用户上传图像] ↓ [Flask WebUI 接收请求] ↓ [调用 MediaPipe Pose 模型推理] ↓ [使用自定义绘图逻辑生成骨骼图] ↓ [返回可视化结果至前端]

其中，mediapipe.solutions.pose.Pose是姿态估计的核心模块，而mediapipe.solutions.drawing_utils则负责默认的骨骼绘制逻辑。

2.2 关键技术点说明

⚠️ 注意：默认情况下，drawing_utils.draw_landmarks()使用的是固定样式，若要实现个性化渲染，必须重写或覆盖默认的 DrawingSpec 参数。

3. 自定义可视化样式实战

3.1 修改前准备

确保你已成功运行该镜像，并能通过Web界面上传图片并看到默认的红点白线骨骼图。

进入项目代码目录，找到主处理脚本（通常为app.py或inference.py），定位到如下代码段：

import mediapipe as mp mp_pose = mp.solutions.pose mp_drawing = mp.solutions.drawing_utils # 姿态估计实例 pose = mp_pose.Pose( static_image_mode=True, model_complexity=1, enable_segmentation=False, min_detection_confidence=0.5 ) # 检测关键点 results = pose.process(image_rgb) # 默认绘制方式 if results.pose_landmarks: mp_drawing.draw_landmarks( image, results.pose_landmarks, mp_pose.POSE_CONNECTIONS )

我们要做的，就是在这段代码中注入自定义的绘图样式。

3.2 定义自定义绘图样式

✅ 修改目标：

• 左侧关节：蓝色圆点
• 右侧关节：绿色方块
• 中轴线（脊柱）：黄色粗线
• 其他骨骼线：青色细线
• 不显示面部关键点

🎨 实现代码如下：

from mediapipe.python.solutions.drawing_utils import DrawingSpec from mediapipe.python.solutions.pose import POSE_CONNECTIONS import cv2 # 自定义颜色（BGR格式） LEFT_COLOR = (255, 0, 0) # 蓝色 RIGHT_COLOR = (0, 255, 0) # 绿色 CENTER_COLOR = (0, 255, 255) # 黄色 OTHER_COLOR = (255, 255, 0) # 青色 # 关键点样式：根据左右位置设置不同颜色和形状 landmark_style = {} for idx in range(33): if idx in [0, 1, 2, 3, 4]: # 忽略面部关键点 continue elif idx % 2 == 0: # 右侧关键点（偶数索引） landmark_style[idx] = DrawingSpec(color=RIGHT_COLOR, thickness=5, circle_radius=6) else: # 左侧关键点（奇数索引） landmark_style[idx] = DrawingSpec(color=LEFT_COLOR, thickness=5, circle_radius=6) # 连接线样式 connection_drawing_specs = [] for edge in POSE_CONNECTIONS: start_idx, end_idx = edge if start_idx in [0,1,2,3,4,5,6,7,8,9] and end_idx in [0,1,2,3,4,5,6,7,8,9]: continue # 不绘制面部连接线 elif (start_idx == 1 and end_idx == 2) or (start_idx == 2 and end_idx == 3): # 鼻子到眼睛 continue elif start_idx in [11,12,23,24] and end_idx in [11,12,23,24]: # 中轴线（肩→髋） spec = DrawingSpec(color=CENTER_COLOR, thickness=8, circle_radius=3) else: spec = DrawingSpec(color=OTHER_COLOR, thickness=4, circle_radius=2) connection_drawing_specs.append((edge, spec))

3.3 替换默认绘图逻辑

将原始的mp_drawing.draw_landmarks()替换为以下增强版调用：

if results.pose_landmarks: # 使用自定义样式绘制 for connection, spec in connection_drawing_specs: start_idx, end_idx = connection landmark_list = results.pose_landmarks.landmark if landmark_list[start_idx].visibility < 0.5 or landmark_list[end_idx].visibility < 0.5: continue # 跳过低置信度连接 cv2.line( image, (int(landmark_list[start_idx].x * image.shape[1]), int(landmark_list[start_idx].y * image.shape[0])), (int(landmark_list[end_idx].x * image.shape[1]), int(landmark_list[end_idx].y * image.shape[0])), color=spec.color[::-1], # BGR转RGB thickness=spec.thickness ) # 单独绘制关键点（支持方形/圆形混合） for idx, landmark in enumerate(results.pose_landmarks.landmark): if idx not in landmark_style or landmark.visibility < 0.5: continue x = int(landmark.x * image.shape[1]) y = int(landmark.y * image.shape[0]) spec = landmark_style[idx] if idx % 2 == 0: # 右侧：画方块 cv2.rectangle(image, (x-5, y-5), (x+5, y+5), spec.color[::-1], -1) else: # 左侧：画圆 cv2.circle(image, (x, y), spec.circle_radius, spec.color[::-1], -1)

3.4 效果对比说明

✅优势体现： - 更易区分左右肢体，适合运动指导类应用 - 视觉层次清晰，突出身体中轴稳定性 - 减少面部干扰，聚焦躯干与四肢动作

4. 高级技巧与优化建议

4.1 动态样式控制（按动作类型切换）

你可以根据检测到的动作类别（如“深蹲”、“瑜伽树式”）动态加载不同的样式配置：

def get_style_by_action(action_name): styles = { "squat": {"joint_color": (0,0,255), "line_color": (128,128,128)}, "yoga": {"joint_color": (255,165,0), "line_color": (255,255,255)} } return styles.get(action_name, styles["squat"])

4.2 添加透明度支持（适用于AR叠加）

使用cv2.addWeighted()实现半透明骨骼层：

overlay = image.copy() # 在overlay上绘制骨骼... cv2.addWeighted(overlay, 0.7, image, 0.3, 0, image) # 70%骨骼图 + 30%原图

4.3 性能优化提示

• 若仅需部分关键点（如只关注腿部），可在POSE_CONNECTIONS基础上构建子集连接图
• 对视频流场景，启用static_image_mode=False提高帧率
• 使用numpy向量化操作替代循环提升绘图效率

5. 总结

本文围绕AI人体骨骼检测的可视化二次开发，详细讲解了如何基于 Google MediaPipe Pose 模型，突破默认“红点白线”的限制，实现高度个性化的骨骼渲染效果。

我们完成了以下关键实践： 1.理解MediaPipe绘图机制：掌握DrawingSpec与POSE_CONNECTIONS的作用 2.实现多样式混合渲染：左蓝右绿、中方右方、中轴加粗 3.隐藏非必要元素：去除面部关键点干扰 4.提供可扩展架构：支持动态样式切换与透明度叠加

这些技巧可广泛应用于： - 健身动作纠正系统 - 舞蹈教学可视化平台 - 虚拟偶像驱动引擎 - 医疗康复评估工具

通过简单的代码改造，就能让AI骨骼检测从“能用”走向“好用”，真正服务于产品体验升级。

💡获取更多AI镜像

想探索更多AI镜像和应用场景？访问 CSDN星图镜像广场，提供丰富的预置镜像，覆盖大模型推理、图像生成、视频生成、模型微调等多个领域，支持一键部署。