有什么方法可以绘制具有相对定位的画布图像

Question

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

我能够绘制多个图像，但它们的位置仅相对于画布的 (0, 0)（左上角）。有没有办法将它们相对于某个点而不是原点定位？在我的情况下，圆的中心 (300, 300)？

Answer 1

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

有关画布转换的更多信息，请参阅https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Transformations。