我在用js写一个五子棋游戏，利用canvas画棋盘和棋子，为了实现悔棋功能，我用clearRect()清除了原来的棋子，再重新画被清除的部分棋盘，却总是出现了一个圆，请大神帮帮忙，谢谢！
4
826
Chess by sheepbao
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
只看了描述，没有看代码。
你的这个想法实现起来比较麻烦，简单的方法是重画整个画布，这样你只关注数据就可以了。
创建一个二维数组，用作棋盘的数据。
在每一回合里，下棋或者悔棋都操作这个数组。
操作完数据，把画布全清，重新用数据画一个棋盘。
看了你的代码，你的棋盘线跟棋子都是用path实现的, context.stroke(); 会把所有path stroke出来(就是描边的意思)，而你悔棋的函数没有清除上一步棋对应的path,因此context.stroke();描画棋盘线的时候也把棋子描边出来了。ps：棋盘线因为是固定且不变的，所以其实可以通过另外的一个canvas作为背景去展示,这样可以优化重绘的性能。