3D 中国象棋上线:三档 AI 陪练,规则一条没省
先说结论:游戏站多了第 9 款游戏——3D 中国象棋,地址 games.cosmocat.dev/games/xiangqi。免下载、免注册,手机打开就能下。
我做的不只是"放个链接":原版只适配横屏、依赖公共 CDN、界面是繁体中文;这版做了简体化、把 Three.js 下载到本地、补了竖屏自适应和站内导航,真浏览器逐项验过才开始写这篇文章。

一、它和"网页象棋"不一样在哪
多数网页象棋是 2D 平面:棋盘是图片,棋子是圆片,点一下挪一格。能下,但没什么"在棋盘前"的感觉。
这一版用 Three.js 搭了真正的 3D 场景:棋盘是木纹的,棋子是带厚度的木圆柱,每颗棋子的字都是程序化画上去的;落子有抛物线动画,吃子有收缩效果,拖一下空白处可以绕着棋盘换视角。
但真正让我愿意把它放进游戏站的原因是——它不是"好看的空壳"。

整个项目分成三层:main.js 负责 Three.js 渲染与交互,game.js 是纯逻辑的规则引擎(不依赖渲染代码),ai.js + ai-worker.js 负责算棋。层次分开的好处很直接:规则引擎可以单独跑测试,AI 可以放在 Web Worker 里不卡界面。
二、规则不是"差不多就行"
很多网页小游戏在规则上会偷懒:马随便跳、炮随便吃、长将不管。这一版把正式规则都写进了引擎。

- 蹩马腿:马要走的直角方向上有子,就跳不过去;
- 塞象眼:田字中心有子,象走不了;
- 炮翻山:吃子必须隔且只隔一个炮架;
- 白脸将:将帅同列且中间无遮挡,等于被将;
- 将死 / 困毙:无解将、无子可动都判负;
- 长将判负与三次重复判和:同一局面第三次出现时自动裁决,不会让你和 AI 无限对拉。
右侧还有传统棋谱:每一步按「炮二平五」「马八进七」记,会下棋的人一眼能看懂刚才走了什么。
三、三档 AI:差别在"看多远"

AI 用的是 negamax + alpha-beta 剪枝,加上静态搜索、置换表和杀手着法。三档难度的区别就在搜索深度和随机性:
| 难度 | 搜索深度 | 单步思考上限 | 随机性 |
|---|---|---|---|
| 简单 | 1 层 | 0.4 秒 | 30% 概率乱走 |
| 中等 | 3 层 | 0.9 秒 | 小幅随机 |
| 困难 | 6 层(残局可达 8 层) | 2.2 秒 | 几乎无 |
关键一点:算棋跑在浏览器的 Web Worker 里。困难档算到 6 层也不会把画面卡住——你还能一边等它想,一边转视角。
四、实测:点棋子会亮出可走位置
我用自己的浏览器完整下了一局的开局,确认了三件事:棋盘能正常渲染(32 颗棋子,零控制台报错)、点棋子会亮出可走点(绿点是空位、红圈是能吃)、落子后棋谱会正确记录。

上图里红方已经吃过一个黑卒,左侧"红方吃子"托盘里能看到,右侧棋谱记到了"炮五进四"。
五、手机上也能下
原版是为横屏设计的,竖屏打开时棋盘会被裁掉两边。我补了一段自适应逻辑:竖屏时自动增大相机视野,保证整个棋盘横向完整可见。

手机上棋盘占满屏幕,吃子托盘浮在底部,次要按钮(音效、视角、全屏、GitHub)都收进右上角"⋯",界面不挤。
六、三个我暂时没解决的局限
说实话比夸更重要,这三条得讲清楚:
- AI 不是顶尖水平。 困难档 6 层搜索,对普通玩家够用;但和专业象棋引擎(动辄 20 层以上 + 开局库 + 残局库)不是一个量级。想认真练棋,还是建议配一个专业引擎复盘。
- 不能联网对战。 现在只有人机和同屏双人。做联网房间需要 Cloudflare 的 Durable Objects,那是付费功能,暂时不开。
- 界面还带着上游的设计语言。 我做了简体化和导航,但整体视觉是原作者的设计,改太多反而破坏了原本的完成度。
七、怎么玩
打开 games.cosmocat.dev/games/xiangqi,默认是"人机·中等",你执红先行。想放松就切"简单",想认真下就切"困难";两个人一台设备就用"双人对弈"。
不会下也没关系,我另写了一篇玩法攻略:规则要点与开局思路,从七种棋子怎么走讲到三步开局。
八、来源与许可
这款游戏来自开源项目 doggy8088/chinese-chess,MIT 协议,作者 Will 保哥,用 AI 辅助完成。我在他的基础上做了简体中文化、Three.js 本地化、竖屏适配与站内导航,玩法与规则逻辑没有改动。原文的在线版在 chinese-chess.gh.miniasp.com。
游戏站现在一共 9 款游戏,全部纯前端、零服务端:games.cosmocat.dev。