用代码实时生成 60 种昆虫的 3D 图鉴,仓库里没有一个模型文件

XR843 2026-08-12 10:31 1

在线: https://insect-world.pages.dev
源码: https://github.com/xr843/insect-world ( MIT )

可交互的 3D 昆虫图鉴,60 个物种覆盖 14 个目。旋转、缩放、点模型上的彩色标注点看身体构造,有分步讲解和真能作答的小测。中英双语,双主题。

有意思的地方只有一个:每一只虫的几何体都是 TypeScript 在浏览器里现算出来的,仓库里没有一个 .glb/.gltf ,也没有一张贴图。

同类的 3D 解剖站点每个模型是几 MB 的 GLB 资产,靠采购或扫描得来。昆虫没有这种现成资产可买,所以把形态参数化了 —— 体分头/胸/腹三段,胸部生三对足两对翅,附肢是分节的锥管,翅面由放射状翅脉支撑。写成参数以后,加一个物种只要写一份尺寸与配色的描述,而不是再买一个模型。

- 单个物种 1.4 万~3.6 万三角面,浏览器里构建耗时 30~90ms
- 首屏 JS gzip 约 424KB ,物种代码按需分包,点到谁才下载谁
- 表面微观(刻点/沟纹/绒面/蜂窝复眼)由程序贴图在运行时生成
- 讲解每翻一步,3D 镜头自己移到讲到的那个部位上

代价是写实度不如三维扫描,换来的是零资产依赖、任意可扩展。

https://raw.githubusercontent.com/xr843/insect-world/master/docs/screenshots/05-gallery.jpg

需要说明:图鉴的讲解文案由 AI 撰写,没经过昆虫学文献或专业人士逐条核校,别当引用资料用;英文版也是 AI 翻译的。学名两版一致。发现错处欢迎开 issue 。
最新回复 (1)
  • ytFG 08-12 15:28
    1
    效果不错,怎么描述的。直接让 ai 生成的模型有点抽象
* 帖子来源V2EX
返回