小编Dar*_*ell的帖子

我正在使用 for 循环生成六边形网格，但遇到了一些问题

    for (var i=0; i <= rows; i++) {
        for (var j=0; j <= cols; j++) {
            ctx.save();
            ctx.translate(0+i*distX, 0+j*distY);
            drawHexagon(ctx);
            ctx.fill();
            ctx.restore();
        }
    }

我的最终目标是创建一个六边形网格，当鼠标光标在页面上移动时，该六边形网格会远离鼠标光标，并产生影响区域。我不知道如何在每个六边形之间绘制路径，并且在尝试为六边形设置动画时也遇到问题。

我仍然是一个画布新手，我浏览了 Mozilla 开发者网络上的教程，所有动画都是在单个对象上，而不是在网格中生成的对象。

我想我应该尝试存储网格并稍后影响它，但我不确定我会如何去做，我也不认为画布是这样工作的。

我发现这几乎是我想做的，但我无法理解它是如何工作的： http: //codepen.io/soulwire/pen/Ffvlo

我现在很好地梳理它，如果有人能引导我完成它，那就太好了:)

编辑：我已经在点后面绘制了一个网格，我也想操纵它。我仍然不明白上面链接的代码笔，它有点超出我的理解范围。