基于纯 HTML5 Canvas 2D、CSS 和 JavaScript 实现的毕业设计项目。项目主题为“西游记自走棋——取经之路”,无需外部框架,可通过本地静态服务器在浏览器中运行。
cd HTML5-AutoChess
python -m http.server 8010 --bind 127.0.0.1然后打开:
http://127.0.0.1:8010/index.html
说明:不推荐长期使用 file:// 直接打开,因为部分浏览器会限制本地图片与 Canvas 像素读取。
- 棋盘规格:9 列 x 8 行,上半区为敌方区域,下半区为我方区域。
- 英雄体系:24 名西游记主题英雄,按 1-5 费分布。
- 羁绊体系:大唐、花果山、天庭、西天、妖族、龙族。
- 精灵规范:每个角色使用 5 行 x 5 列 PNG 精灵图。
- 动画状态:待机、移动、攻击/技能、受击、死亡。
- 核心流程:备战阶段、选秀阶段、战斗阶段、结算与下一回合。
- UI 方案:
assets/ui/ui_shell_1672x941.png作为静态整页 UI 壳,动态内容由 HTML/CSS 覆盖。 - 设置与图鉴:顶部提供图鉴、跳过、速度、音效、设置、全屏等功能按钮。
| 操作 | 说明 |
|---|---|
| 点击商店卡片 | 购买英雄 |
| 拖拽备战席英雄到棋盘 | 上阵英雄 |
| 拖拽棋盘英雄 | 调整站位 |
| 右键英雄 | 出售英雄 |
| 悬停英雄 | 查看英雄属性面板 |
| 悬停羁绊 | 查看羁绊说明与相关英雄 |
| 图鉴按钮 | 打开英雄图鉴 |
| 设置按钮 | 打开设置面板 |
HTML5-AutoChess/
index.html 游戏入口,包含主要 HTML/CSS/JS
操作指南.html 用户操作说明和演示建议
提交说明.md 最终提交文件说明
GDD.md 当前版本游戏设计概要
character/ 正式角色 PNG 精灵图
assets/ui/ 正式 UI 美术资源
assets/ui/generated/ 已拆分并接入的生成资源
毕业设计论文、开发计划、英雄体系、精灵规范、资源生成提示词等集中在:
../Document/
当前最终提交材料为:
../Document/06_最终提交材料_20260515/
替换角色精灵图时保持文件名不变,放入 character/ 目录即可。推荐规格:
- PNG 透明背景
- 5 行 x 5 列
- 每格 64 x 64
- 总尺寸 320 x 320
- 第 1 行正面待机/行走
- 第 2 行右侧移动
- 第 3 行背面移动
- 第 4 行正面攻击/技能
- 第 5 行受击/倒地/死亡
提交源码时至少包含:
index.html
操作指南.html
README.md
提交说明.md
GDD.md
character/
assets/ui/