如何在 html 画布上独立旋转 2 个图像

发布于 2024-12-04 16:14:44 字数 217 浏览 1 评论 0原文

我想使用 HTML 画布显示一组齿轮。我有以下 http://jsfiddle.net/jeepstone/RpmuE/ 但小齿轮围绕大齿轮旋转,而不是保持固定并只是旋转。一旦我把它修好,我就可以计算出齿轮的相对速度,但我无法弄清楚为什么它围绕主齿轮移动。

有什么想法吗?

I want to show a set of gears using HTML canvas. I've got the following http://jsfiddle.net/jeepstone/RpmuE/ but the little cog rotates around the big cog rather than staying fixed and just rotating. Once I have it fixed I can work out the relative speeds of the cogs but I can't work out why it moves around the main cog.

Any ideas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

夏末 2024-12-11 16:14:44

演示

哈,很酷的想法,我认为导致问题的主要原因是缺少恢复。要记住的一件事是您要在旋转之前进行翻译。否则,您将平移canvas,然后旋转整个canvas,从而旋转上下文中的所有内容。

Demo

Hah cool idea, the main thing I think causing the issue was a missing restore. A thing to remember is you want to do your translates before the rotations. Otherwise you will translate the canvas, and then rotate the whole canvas thus rotating everything on the context.

掐死时间 2024-12-11 16:14:44

啊好吧。这是有道理的。装上变速箱!

Ah ok. That makes sense. Bring on the gearbox!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文