原理说明
读懂这缸水背后的一套简单规则。
① 食物链:能量如何流动
系统由三层构成一条最基础的食物链:
- 水草(生产者):固定在缸底,靠光照生长,是能量的源头。
- 浮游生物(初级消费者):靠近水草时补充生命,远离则逐渐衰减直至死亡。
- 小鱼(顶级消费者):感知最近的浮游并追逐捕食以恢复生命;生命归零即死亡。
图示:🌿 水草 → ⚪ 浮游 → 🐟 小鱼。任何一层断链,上层都会随之崩溃。
② 环境参数:系统的外部旋钮
- 光照强度:高于 50% 水草生长、低于则枯萎;光照越足,生产者越旺。
- 水温:最适区间 22±6℃。一旦超出耐受窗,鱼与浮游会承受额外的死亡压力。
- 环境承载上限:硬约束自然增殖、繁殖与投放的总生物量,防止无限膨胀。
③ 代码实现思路
引擎用原生 Canvas 2D 实现,无任何第三方库:
- 生物对象:每种实体都是一个含位置、速度、生命/健康值的纯数据对象。
- 逐帧更新:
requestAnimationFrame驱动;dt归一化到 60fps 并clamp防跳变;按 devicePixelRatio 适配高清屏。 - 规则循环:每帧依次更新 水草→浮游→小鱼→繁殖→浮游自然补充,再统一绘制。
- 解耦:引擎只管画布与模拟,通过
window.EcoSand(canvas)暴露 API(暂停/继续/重置/设参/投放/快照/预设),交互逻辑独立在ui.js。
④ 项目信息
一个用于演示「简单规则如何涌现复杂生态行为」的小沙盘。
原生 Canvas 2D
零依赖
食物链模型
预设实验
快照留档