HTML5 黑白五子棋由刀豆文库小编整理，希望给你工作、学习、生活带来方便，猜你可能喜欢“html5五子棋游戏”。
html5 黑白棋，与之前的canvas游戏不一样，五子棋的游戏思路，canvas不需要每次都清楚渲染一遍，而是在原来的基础上绘制。由于没有时间限制，因此不需要动画主循环。五子棋的棋子采用两者png 图片，用 canvas的 image 接口绘制棋子。
写这个主要是实现下二维数组的使用。游戏很简单，没有AI对弈。自己和自己玩。
算法介绍
准备一个二维数组map，通过二维数组构造一个点。点的值若为0 则表示空，为1 则表示有白棋，为2 则有黑棋站位。
捕捉鼠标事件，如果是白棋则讲map的点填上相应的表示。通过当前的点，循环左右上下，左上右下等八个方向，如果有连续的 1或者2 则表示白棋或黑棋赢。
需要注意是如何理解两个循环变量的循环。代码如下
html
五子棋body {margin: 10px;} 你的浏览器不支持HTML5 canvas，请使用 google chrome 浏览器 打开.
