昆虫世界：仓库里没有一个模型文件，63 只虫全是代码实时生成的 3D 图鉴

图鉴总览：63 种昆虫 / 14 个目，全部代码实时生成

今天推一个很特别的开源项目：昆虫世界（insect-world）。它是一个可交互的 3D 昆虫图鉴，收录了 63 种昆虫，覆盖 14 个目，你可以在浏览器里旋转、缩放、点击标注点看身体构造。但最让人震撼的是——

每一只虫都是代码实时生成的，仓库里没有一个模型文件，也没有一张贴图。全部用 TypeScript + Three.js 在浏览器里过程化生成。

这听起来像个技术炫技项目，但它做出来的东西却美得不像。日间是冷灰绿的「标本台」，配青铜铭牌；夜间一键切到「博物馆之夜」，黑底黄铜骨架，金属鞘翅和萤火虫尾灯在聚光灯下起飞。这不是贴图能做出来的质感。

过程化生成能做什么？扫描模型做不到的事

如果每只虫都是从外部导进来的 3D 模型文件，那 63 种 × 多个阶段就是几百个模型要存、要管理、要加载。作者一个都没存，全部用几何参数在代码里画。

这样做最大的红利是生活史。底部点开「生活史」卡片，展台会跟着弹窗逐步换成卵、幼虫、蛹的立体标本。目前做了八种，共 22 个阶段模型。因为同一套画成虫的代码逻辑也参数化地画得出卵、幼虫和蛹——这是扫描模型做不到的事。

比如独角仙的蛴螬（幼虫） 已长出角雏形的蛹 黑亮成虫，反差最大的一条；帝王蝶金斑绿蛹垂蛹倒挂；柞蚕蛾纵向半剖的茧能看见里面的蛹；中华黄萤的卵、幼虫、蛹全都发光。

它们是活的

站定的虫在做极小幅度的姿势微调，六条腿按着生位置错开相位。更妙的是八种本来就会悬停的虫——蜻蜓、豆娘、蜜蜂、熊蜂、食蚜蝇等——在原地振翅。蜻蜓目的前后翅反相扑动，那是它们能悬停的原因，也是一眼认出蜻蜓的动态特征。

作者还诚实地说了一个工程取舍：蜜蜂真实拍翅 230Hz、食蚜蝇 200Hz，但 60fps 屏幕的奈奎斯特上限只有 30Hz——照实数驱动的结果不是「快」是混叠，翅膀会看起来慢慢倒着扇。所以用对数压到 4~12Hz，保住物种之间的相对次序，真实频率留在代码数据表里，压缩函数写在旁边，不藏。

互动学习，不只是看

左栏点选或用方向键逐只翻，拖动转动虫体、滚轮拉近、点彩色圆点看部位说明。左侧工具条有聚焦、剖切（沿矢状面切开）、分层（外骨骼半透明）、对比（展台底部浮出对照条）四个操作。右栏的分步讲解，每翻一步镜头会自动移到讲到的部位；小测是真能作答的，判对错、给解释、统计得分。

分步讲解：讲到哪一步，镜头就移到哪个部位

项目信息

仓库：xr843/insect-world

在线体验：insect-world.pages.dev

语言：TypeScript + Three.js ·协议：MIT

规模：63 种 / 14 目 / 22 个生活史阶段 · 4000+ 测试

部署：Cloudflare Pages 静态托管，无后端

体验地址：https://insect-world.pages.dev/