javascript - js 用canvas 画圆清除问题？

看了你的代码，你的棋盘线跟棋子都是用path实现的, context.stroke(); 会把所有path stroke出来(就是描边的意思)，而你悔棋的函数没有清除上一步棋对应的path,因此context.stroke();描画棋盘线的时候也把棋子描边出来了。ps：棋盘线因为是固定且不变的，所以其实可以通过另外的一个canvas作为背景去展示,这样可以优化重绘的性能。

创建一个二维数组，用作棋盘的数据。
在每一回合里，下棋或者悔棋都操作这个数组。
操作完数据，把画布全清，重新用数据画一个棋盘。

只看了描述，没有看代码。
你的这个想法实现起来比较麻烦，简单的方法是重画整个画布，这样你只关注数据就可以了。

点击悔棋按钮之后，之所以会重绘上一次绘制的圆圈，是因为路径没有闭合的原因，
修改意见：你的undoStep()函数，擦除矩形后，在调用context.beginPath();开始一段新的路径，如下图：

另外，你擦除的区域和重绘的区域太小啦，你改了之后就能看见，太小了