HTML5 画布:如何为上下文设置动画

HTML5 canvas: How to animate context?

本文关键字：上下文设置动画画布 HTML5 更新时间：2023-09-26

有没有办法在HTML5画布2d中对上下文进行动画处理？

我想创造巨大的背景，但只在屏幕上显示其中的一小部分。然后，我想应用translate动画来滚动上下文以显示上下文的其他部分。

我应该怎么做？

创建一个画布，其中包含要显示的整个内容的上下文，如果需要，可以通过将其显示在屏幕上来执行此操作，以便可以看到它的外观。

然后把你所拥有的东西放在一个函数或某种闭包中。然后使用 document.createElement（'canvas'），并将其上下文用于为显示上下文创建的代码。

然后，您可以在可见画布的主上下文中使用 .drawImage（）将其他上下文绘制到屏幕上，并在动画循环中向上设置动画。

我希望我能使它更容易理解，通过展示一个例子更容易理解。

屏幕外渲染本质上是我想解释的。