ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

一张图找不到、一段话说不清?免费开源姿势搜索工具 Pose-Search 带你用动作本身找图

一张图找不到、一段话说不清?免费开源姿势搜索工具 Pose-Search 带你用动作本身找图 一张图找不到、一段话说不清免费开源姿势搜索工具 Pose-Search 带你用动作本身找图【免费下载链接】pose-searchx6ud.github.io/pose-search项目地址: https://gitcode.com/gh_mirrors/po/pose-search凌晨两点健身教练小林还在电脑前翻相册。学员发来一张训练照问教练这个动作我哪里做得不对小林盯着照片想起自己手机里存着三千多张学员动作对比图可他就是找不到那张姿势几乎一模一样的标准示范图。他试过在相册里搜深蹲弓步髋铰链搜出来的全是关键词命中的动作压根不匹配。他叹了口气图片明明就在库里用嘴却说不出来它长什么样。这个场景你是不是也遇到过想在素材库里找左臂弯曲45度、右腿向后蹬地的图关键词打了三行还是找不到想在海量照片里挑出投球姿势最标准的一张眼睛都快看花了。问题不在你的搜索技术而在于动作这种信息本来就不该用文字来描述。一句话定位这是给人体动作量姿势标尺的开源搜索工具Pose-Search 是一个基于 AI 姿势识别的人体姿势搜索工具。它和你见过的图片搜索完全不同——不需要你输入任何关键词你只需要给它一张参考图它就会自动提取图中人物的骨骼动作然后在你自己的图片库里按相似度把动作最接近的图片排好序给你。它的本质就是把姿势变成一串可计算的数字33 个身体关键点脸、肩膀、肘、胯、膝盖、脚踝的位置和角度然后用这套数字去量图库里的每一张照片。仓库地址https://gitcode.com/gh_mirrors/po/pose-searchMIT 协议免费开源拿去商用也没问题。先看效果3 分钟跑起来把第一张图搜出来别急着了解原理先动手。这套项目跑起来比想象中快全程只需要三条命令git clone https://gitcode.com/gh_mirrors/po/pose-search cd pose-search npm install npm run dev浏览器会自动打开本地服务默认http://localhost:3000。项目自带一个已经处理好的图片库——左侧是搜索区中间是三维骨骼模型右侧是搜索结果列表。怎么玩就三步在左侧的骨骼模型上拖拽旋转把它摆成你想要的姿势比如举起右手在部位下拉框里选Right Shoulder或Right Elbow相当于告诉它我就按肩膀/手肘这个动作为标准搜点击搜索按钮右侧立刻按相似度从高到低排出结果。不到三分钟你就能看到第一版结果图库里动作最接近的图片全部浮上来每张缩略图中间还标着一个红点指向该图人物的关键关节点。这就是整个工具的完整工作流先看见成果我们再去拆它背后的零件。全景功能地图这个项目到底能干什么功能它解决什么对应代码位置姿势识别从图片里提取 33 个身体关键点src/utils/detect-pose.ts局部动作匹配只比脸、肩、肘、胯、膝等单个部位src/Search/impl/12 个匹配器左右镜像匹配自动识别并兼容左右手的镜像姿势匹配器内置flip逻辑三维骨骼可视化拖拽旋转一个可交互的人体模型来摆姿势src/components/SkeletonModelCanvas/图片库管理批量导入照片、标注性别、保存数据库src/Editor/视角无关模式忽略拍摄角度只看动作本身src/Search/Search.ts中的cameraUnrelatedMatcher结果排序与筛选按相似度排序、按性别筛选src/Search/impl/search.ts逐个说几个最值得玩的部分。局部匹配是它的杀手锏。它把人体拆成 12 个可独立搜索的部位Face、Chest、Crotch、左右 Shoulder、左右 Elbow、左右 Hip、左右 Knee。想找右手抬到头顶的照片直接选 Right Shoulder 或 Right Elbow 作为搜索维度其他部位的动作差异它就不管了精准锁定你关心的那一段。每个匹配器的完整逻辑都在src/Search/impl/MatchElbow.ts这类文件里命名即文档。视角无关匹配值得单独表扬。图库里同一动作可能有人正面拍、有人侧面拍、有人从背后拍普通匹配会被视角差异干扰。项目给肩、肘、胯、膝四个部位各配了一个CameraUnrelated版本见src/Search/Search.ts第 42~84 行的cameraUnrelatedMatcher配置切到这个模式它只比较动作本身的空间关系跟镜头站在哪儿无关。三维骨骼模型是真·交互式的。中间那个灰色人形不是摆设你可以直接用鼠标拖拽它的四肢关节摆出任何你想搜的姿势还能点击某个关节快速切换匹配部位。模型由 14 段 OBJ 几何体拼装而成加载和渲染逻辑在src/components/SkeletonModelCanvas/model/SkeletonModel.ts。阶梯式上手教程从照抄到改造成自己的搜索库L1 基础跑通示例、摸清搜索交互操作启动项目后先随便拖拽右侧模型摆一个姿势换不同部位反复搜索。预期结果你很快会感觉到搜动作比搜关键词直观得多——摆姿势本身就是搜索条件所见即所得。小技巧结果缩略图上的红点是该图对应关节的位置点击任意结果还能看大图对比。L2 进阶换一套自己的图片库操作编辑public/photos.json和public/landmarks.dat替换成你自己的图片清单和关键点数据。数据格式很规整landmarks.dat是二进制文件每张图 33 个点 × 7 个浮点数归一化坐标 3 个、世界坐标 3 个、可见度 1 个读写逻辑都在src/utils/PhotoDataset.ts。预期结果搜索时用的就是你的私人图库了。进阶玩法更省事的路是走编辑器。打开/#/editor从 Unsplash 申请一个免费 App Key 贴进去就能边看图边点Add Record把图片连同姿态数据一键入库最后点Save data.db落盘。L3 熟练调参数、加匹配器操作打开src/config.ts你能看到两个全局开关LANDMARK_VISIBILITY_ACCEPTABLE_THRESHOLD 0.4关键点可见度低于这个值的关节直接跳过不参与打分。你的图片库如果模糊照片多可以试着调低到 0.3。MAX_NUM_OF_SEARCH_RESULTS 100结果上限图库大的话可以调高。预期结果搜索结果的数量和质量都能按你的数据特点微调。再进一步想自定义匹配算法匹配器只需要实现一个极简接口——prepare(model)负责从参考姿势提取特征match(photo)负责给每张图打分返回分数和关键点位置。照着src/Search/impl/里现成的类抄一个注册进Search.ts的matchers对象即可。通俗化原理把算法想成给身体画了一把角度尺这套系统的工作原理可以拆成三个环环相扣的环节每个环节都能用生活里的东西打比方。第一环给身体点穴。MediaPipe Pose 模型会在每张人像图上标记出 33 个关键点——鼻子、双耳、双肩、双肘、手腕、胯、膝盖、脚踝……就像中医点穴把身体的支点全部标出来。这一步的输出是每个点的三维坐标加一个可见度置信度。注意看src/utils/detect-pose.ts里第 42 行写死了NUM_OF_LANDMARKS 33这就是整套系统的骨架起点。第二环画角度尺。单看坐标没用坐标会随拍摄距离、画面大小变化。所以算法把坐标换算成角度——比如手肘的弯曲程度就是上臂方向向量和小臂方向向量之间的夹角。角度这个量天生和远近大小无关这是它敢说自己无论怎么拍都能比的底气。src/Search/impl/math.ts里那一堆向量运算函数干的就是这活儿。第三环算姿势差。有了参考姿势的角度再去量图库里每张图对应关节的角度差值越小分越高最后把分数乘起来排序。它比的是你摆的姿势和参考姿势差了多少度而不是图上有没有这个动作的关键词。这也是为什么它能覆盖左臂弯曲45度这种文字根本无法表达的需求——文字描述是离散的、含糊的角度是连续的、精确的。真实体验报告夸它什么、也告诉你它卡在哪先说优点都是实测过得出的结论搜索直觉性拉满。用姿势当搜索条件是零学习成本的你拖一下模型、点一下搜索结果就出来了比敲三行关键词快得多。局部精度出乎意料。选 Elbow 就只看肘部肩、胯的差异完全不干扰排序对只关心某一个动作细节的场景非常对症。完全本地化、零服务端依赖。推理全部在浏览器里跑WebGL2不传图到任何服务器隐私友好。代码结构清晰适合当学习范本。Vue 3 Vite TypeScript 组合匹配器接口只有两个方法读起来像读文档。再说局限丑话说在前面图库需要自己积累。项目自带示例数据但那是演示用的真正要搜自己的素材得先通过编辑器批量录入这一步有工作量。多人场景不友好。默认按单人姿势处理一张图里几个人同时出现时识别结果会互相干扰。视频不支持。输入是静态图片逐帧分析视频是未来的事。对关键点可见度敏感。背对镜头、严重遮挡、肢体被截断的照片关节没被点穴到匹配效果会明显打折。横向比一下常规图片搜索如按文件名、标签、关键词检索胜在快但只能搜到人话能描述的东西Pose-Search 走的是一条完全不同的路它搜索的对象是语言描述不出来的东西。二者不是替代关系而是互补——前者负责粗筛后者负责精比。避坑清单6 个常见错误与解法常见错误现象解决办法不装依赖直接跑报vite找不到命令先执行npm install确认node_modules存在再npm run dev图片中人物被遮挡搜索时该关节直接失联结果全空检查src/config.ts的LANDMARK_VISIBILITY_ACCEPTABLE_THRESHOLD从 0.4 降到 0.3 试试选了部位却没结果图库里没有同时满足该部位可见的图先选 Face 或 Chest 这种几乎必然可见的部位验证流程再切局部关节结果数量远少于预期被MAX_NUM_OF_SEARCH_RESULTS 100或可见度过滤拦住了确认图库数量、调高结果上限、检查是否误开了性别筛选编辑页拿不到图编辑器需要 Unsplash App Key在 Unsplash 后台申请 Key 并粘贴到编辑器对应输入框修改了数据文件不生效搜索用的还是旧数据改完photos.json/landmarks.dat后重启npm run dev浏览器强刷缓存去把第一张按动作找的图搜出来回到开头的小林。如果他装了 Pose-Search流程会变成把学员的照片喂给系统识别姿势用三维模型微调出标准示范动作再一键搜库——三秒钟那张他翻了半夜都没找到的对比图就会出现在结果第一位。他省下的不是几分钟而是看得见却搜不到的无力感。而你现在已经知道它怎么用、怎么改、怎么避坑了。下一步很明确clone 仓库跑起来先拿自带的示例库摆几个姿势玩一玩再建一个属于自己的姿势图库。觉得好用就给这个 MIT 开源项目点个 star或者把你写的新匹配器提个 PR 贡献回去——毕竟能让动作自己说话的搜索方式多一个人用就多一分把好工具做大的可能。【免费下载链接】pose-searchx6ud.github.io/pose-search项目地址: https://gitcode.com/gh_mirrors/po/pose-search创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表