免费开源的3D人体解剖学实验室：不用买模型、不装软件，打开网页就能拆解2234个真实人体结构

你是否曾为医学课程中抽象的解剖图发愁？是否想直观理解“腹主动脉”和“肠系膜上动脉”的空间关系？又或者，作为生物教师，苦于找不到既专业又免费、还能在教室大屏上实时交互的三维教具？Human Atlas正是为此而生——一个完全开源、无需注册、纯网页运行的高精度3D人体解剖探索器。它不是简笔画动画，也不是低多边形游戏模型，而是基于权威医学数据集BodyParts3D 4.0构建的可逐层拆解、逐结构点击、逐名称检索的真实人体数字孪生体，让解剖学从“背名词”回归到“看空间、懂关系、会定位”。

核心功能

点哪选哪，2234个独立结构精准拾取：每一块骨骼、每一条神经、每一束肌肉都对应一个独立可选的3D网格（mesh），点击肱二头肌长头即可高亮并查看其起止点；不同于多数“系统级粗粒度”展示，这里连“第3腰椎椎弓根”这样的微小解剖单元都单独建模，真正实现“所见即所得”的结构级交互。
15大系统一键开关，支持混合叠加与逻辑分组：不仅能单独显示循环系统或神经系统，还可同时开启“骨骼+关节囊+韧带”组合观察运动机制，或关闭所有软组织仅保留内脏轮廓——系统控制不是简单显隐，而是按临床与教学逻辑预设了“骨架模式”“器官模式”等实用场景。
爆炸视图自动排布，空间关系一目了然：点击“Explode”按钮，2234个当前可见结构会智能散开成三维阵列，彼此不重叠、不遮挡，且严格保持原始解剖相对位置（如肝总管始终位于胆囊颈外侧）。该布局经脚本验证适配桌面与手机横竖屏（390×844/320×568等），告别手动拖拽调位的繁琐。
3432个解剖概念全量搜索，支持中英文术语与ID反查：输入“trapezius”或“斜方肌”，结果直接定位到对应肌肉；更支持通过UMLS CUI（如C0040307）或SNOMED CT代码反向查找结构，满足科研文献溯源与跨平台数据对接需求，搜索响应毫秒级，无后端依赖。
单结构隔离+详情面板，信息即点即得：选中“右肾上腺”后点击“Isolate”，模型自动缩放至满屏，右侧弹出结构化详情：含标准命名、所属系统、邻近结构、临床意义简述（如“分泌皮质醇，应激反应关键”），所有描述均标注来源与上下文，避免泛泛而谈。
全设备手势友好，移动端专优设计：在iPhone上单指拖拽旋转、双指缩放、三指平移，控制区域避开底部爆炸视图区；细节面板自动收缩为紧凑模式，文字自适应可读，真正实现“查体式”移动学习——实习医生查房途中掏出手机确认某条分支动脉走向，成为可能。
离线可用，零配置本地部署：克隆仓库后仅需npm ci && npm run dev，无需API密钥、数据库或云服务，5秒内启动本地服务器（http://localhost:3016），适合医学院局域网教学、偏远地区离线培训或学生个人笔记本使用。
严格数据验证，保障教学可靠性：项目内置完整校验链：从几何缓冲区完整性、概念-网格映射一致性，到爆炸布局在7种主流设备分辨率下的非重叠性，再到390+项交互契约测试（如“点击结构必触发详情，滑动不误触选择”），所有验证脚本公开可执行，杜绝“能跑但不准”的教学隐患。

技术亮点

GPU驱动的批量渲染架构：摒弃传统Three.js中每个mesh独立draw call的性能陷阱，将2234个结构合并为极少数几何批次（batches），通过GPU纹理（texture）动态控制每个结构的平移、可见性与选中态，实现在中端笔记本上稳定60fps交互，加载33MB压缩模型后内存占用低于400MB。
浏览器原生WebMCP增强能力：在支持WebMCP（Web-based Medical Concept Processing）的现代浏览器中，自动启用语义化搜索与概念关联推理，例如搜索“心包”时不仅返回心包本身，还联动显示“心包腔”“心包窦”等衍生结构，提升知识发现效率——此功能为渐进增强，不影响基础功能可用性。
几何简化有据可依，精度与性能平衡：对原始BodyParts3D OBJ模型进行自动化优化，采用0.2%相对误差限的保形简化算法，在保留所有解剖特征（如骨嵴、神经沟）前提下大幅降低三角面数，最终模型含228万三角面，兼顾WebGL渲染流畅性与教学辨识度。
全栈TypeScript + Vite + shadcn/ui工程实践：从React组件状态管理（如系统开关状态树）、Three.js场景同步、到响应式UI布局，全程强类型约束；shadcn/ui提供可访问性合规的控件（如键盘导航支持），Vite实现秒级热更新，使二次开发（如添加中文解剖术语库）成本显著降低。

适合哪些人用

这是一款为教育者、学习者与轻量级研究者深度优化的工具：

医学院师生：解剖课前预习时，用爆炸视图理解“腹腔干三大分支”的空间层次；考试复习时，关闭所有标签，仅凭形态识别“哪一个是脾动脉”，强化空间记忆。
临床实习生与规培医生：轮转外科时，在手术间隙用手机快速确认“甲状腺下动脉与喉返神经的毗邻关系”，避免术中误伤；写病历时，通过UMLS ID反查确保术语标准化。
生物科普创作者：制作短视频时，直接录屏演示“膈肌收缩如何改变胸腔负压”，导出高清帧序列；或导出特定结构OBJ文件，导入Blender做二次动画，所有数据均符合CC BY 4.0协议，可合规再分发。

快速上手

无需安装复杂环境，三步启动：

确保已安装 Node.js 22.13+（推荐使用 nvm 管理版本）
终端执行：
git clone https://github.com/ashemag/human-atlas.git cd human-atlas npm ci npm run dev
浏览器打开 http://localhost:3016，即刻开始探索。如需生成静态站点用于内网部署，运行 npm run build，产物位于 dist/ 目录。

同类对比 / 注意事项

相比商业软件（如Complete Anatomy）或学术平台（如BioDigital Human），Human Atlas的核心差异在于：完全开源、零订阅费、数据透明、可审计可定制。它不提供AR/VR扩展或AI问答，但将“结构精确性”“交互确定性”“部署简易性”做到极致。需特别注意：数据源为BodyParts3D 4.0成人男性参考模型，不涵盖胎儿、女性特异性结构或病理变异，亦非临床诊断工具——文中所有解剖描述均明确区分“系统通用背景”与“个体器官特性”，避免误导。另，项目暂未在真机多点触控硬件上全面测试，建议优先使用Chrome/Firefox桌面版或iOS Safari进行关键教学演示。