日期:2014-05-16  浏览次数:20677 次

js 写中国象棋游戏_应用backbone、canvas

中国象棋 ?-- 【代码详细见附件,本版本暂只支持 谷歌的 chrome 浏览器,其它浏览器后续支持 】

作者: 江潇

Version: 0.0.1?

前段时间做了个跳棋,【见跳棋游戏—backbone框架开发】网友反馈功能还好,但棋子跳较简单,且可玩性不高。

建议可以做个象棋看看。于是上周日写了这个游戏,画面未用图片,美观差了些。

依然使用backbone框架管理MVC,目的交流backbone的使用【见透过源码学前端 之 Backbone 一】及二部分。

下载附件包,使用chrome浏览器运行 chess.html。业务代码在 core/chess.js

?

目前支持的功能有

1、生成棋盘

中国象棋_棋盘

2、点击开始,生成双方玩家棋子

中国象棋_棋子

3、任一方可率先开始,规则同象棋规则

中国象棋_棋子路径

4、一方走过后,另一方底边线显彩色表示轮到该玩家进行

?

5、一方“将”被吃后,提示另一方获胜

中国象棋_获取

尚待完善部分:

1、悔棋

?

2、操作声音提示

?

3、代码优化

?

4、欢迎指正其它bug

?

从结构上讲,参照跳棋,分为以下类:

chess ?-- [view] app

coords -- [collection] 所有坐标点

coord ?-- [model] 单个坐标点模型

pieces -- [collection] 所有棋子

pieceEl-- [view] 单个棋子视图

piece ?-- [model] 单个棋子模型

parts ?-- [collection] 某个棋子所有可跳点

partEl -- [view] 可跳点视图

part ? -- [model] 单个可跳点模型

相比而言多了RULE,因跳棋难点在于画非矩阵棋盘及找出每个坐标与周围一圈坐标的关联,在此基础上跳子相对容易,

因为每个子跳法都是一样。

而象棋则棋盘及坐标规整画出来较容易,难点在于每个棋子的关联及吃子算法不一样,所有先在 RULE里定义

好规则,选中每个子时再据其规则,计算可走点及可吃点

?

另外 诚心求教 如何才能实现两个玩家在线实时对战功能,据说可以用 socket IO 进行实时消息推送,

我没用过,不明白如何着手,欢迎指教

1 楼 hlj317 2013-07-02  
上周拜读了楼主的跳棋文章后,已是不禁拍案叫绝~~

想不到短短数日之内,楼主在百忙之中又利用业余时间,做出了一套象棋的游戏,更是不禁拍案叫绝~~

2 楼 hailongshih 2013-07-02  
niubility
3 楼 hlj317 2013-07-02  
喝水不忘掘井人,希望广大读者在下载阅读楼主作品的同时,同时也能留个言支持一下楼主,我们的留言和鼓励,对他来说是前进的动力~~~

这套JS源码分析非常精辟,希望楼主再接再厉,也希望能有更多的人一起参与讨论,互相进步,互相学习~~
4 楼 308202251 2013-07-02  
收_藏了以后看!5楼必须好评
5 楼 inotgaoshou 2013-07-02  
楼主威武啊~下载来拜读学习下~
6 楼 sailei1 2013-07-02  
7 楼 hlj317 2013-07-02  
可以参考一下这篇文章,http://blog.cnbang.net/works/1652/,这个人就是用socket.io+node.js做了一个即连的游戏,一个游戏大厅,里面可以进行实时对战的陆战棋。

以前有做过类似平台的朋友,可以一起讨论一下~~~
8 楼 flex_莫冲 2013-07-03  
不错。很喜欢这游戏。
9 楼 sshzhangwg 前天  
同样喜欢中国象棋游戏,楼主钻研和分享精神值得敬佩!
10 楼 拽的欠扁 前天  
楼主好人。