
在线预览 :FIRELINK · 分布式智能消防
开源地址 :https://github.com/fanhuayishiy/ai-demo (MIT,合集仓库,本项目在 modular-fire-response/ 目录)
原始需求里有一句话是这么写的:「消防无人机机场车也是通过多个无人机分摊水管重量,根据高度起飞不同的无人机,对高空火灾进行救火」。最后它被做成了一台能跑的场景:夜间街区里,两架白色承托机加一架红色末端喷射机,把同一根水带从载车卷盘一路提到 8 层立面。

能玩什么
- 顶部三个机位:任务沙盘、现场跟随、指挥总览,切换不会重启正在跑的那一轮。
- 底部一条装备带,十二辆车、十类模块,点任意一个看它当前阶段;右侧按类列出到场数与总数。
- 「引导演示」与「人工指挥」共用同一套状态;「干预」页里能打开吊人概念并「授权本轮吊人」。
- 支持选择、搜索、聚焦、跟随、镜头巡览、暂停、倍率与重置,另有道路、供水、无人机、能源四类故障开关。
- 演示最多推进 180 秒模拟时间,走完停在复盘、不自动循环;页面进后台不推进时钟。

几个值得放大看的地方
- 三机起飞是排过队的:每隔 7 秒起飞一架,各自 4 秒的垂直起飞阶段互不重叠;两架承托机在出动第 16、23 秒就位,末端喷射机第 30 秒就位。没起飞的那架也始终连着管。
- 供水是一条链:三辆供水车独立往返补水点,M01 移动增压车抵达作业位并拿到连接授权之后才开始供水;把增压车撤回,下游立刻断水。
- 载重无人机 C01 向屋顶接收区吊放四组物资,第 34 秒交接完成才计入交付,整个流程历时 64 秒。屋顶只留四名受困人物与接应标线。
- 七名消防人员随四辆车到场,停车转向完成后错峰下车到各自岗位,离场前先返回登车。
- 人员吊运默认关闭:要开概念、复核生命线索、明确授权,还得赶上出动第 34 至 39 秒的接应窗口,错过就被拒绝。
- 项目自己把话说明白了:这不是实战指挥系统,也不是经过工程验证的消防仿真,建筑、人物、时序、资源和设备参数都是演示设定。
技术栈
React 19 + TypeScript + Vite + Three.js(React Three Fiber / Drei / Lucide),调度与路径用 ngraph.graph、ngraph.path 在道路图上搜索。模型、字体回退和纹理生成不接 CDN。
本地跑起来
bash
git clone https://github.com/fanhuayishiy/ai-demo.git
cd ai-demo/modular-fire-response
npm ci
npm run dev -- --port 5183
关于「分布式」那一大段
提示词最后落在一句很长的清单上:重点展示分布式、自动补水、提前侦查、生命检测、自动调配、高空无人机灭火、无人机投送物资和吊人、机械狗冲入火场、人机协同。边界也写清楚了:调度是预设规则和道路图搜索,不是最优 AI 调度;水带下垂是动画概念,不是张力、载荷或喷射反力的计算结果。

关于这个合集
同一个仓库里还有一批 AI 辅助生成的交互式前端作品,全部 MIT 开源、全部带在线预览:可交互家庭 3D 空间、日式街角便利店微缩沙盘、波音 787-9 结构数字孪生大屏、含氢综合能源数字孪生、单 HTML 文件的智慧校园大屏、仓储运营中心、体素深夜拉面摊......顺带一提,它的显示效果参考就是上面那个仓储演示。
觉得有点意思,可以点个 Star:https://github.com/fanhuayishiy/ai-demo