javascript - 有没有办法用相对定位来绘制 Canvas 图像

Question

我试图在 Canvas 上制作一个轮子，其中有多个相同大小的部分，类似于命运之轮。在轮子的圆周上，即每个段的圆弧上，我想附加一个需要随轮子旋转的图像。

我能够绘制多个图像，但它们仅相对于 Canvas 的 (0, 0)(左上角)定位。有没有办法将它们相对于某个点而不是原点定位？就我而言，圆心 (300, 300)？

Answer 1

您可以通过调用 Canvas 绘图上下文的 .translate(x, y) 方法来翻译 Canvas 的原点；在您的示例中，x 和 y 均为 300。

参见https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Transformations有关 Canvas 转换的更多信息。