使用 Phaser3 截取屏幕的一部分

我想做的事情

这会截取 Phaser3 中显示的屏幕的屏幕截图（快照）。

背景

我尝试获取 Canvas 元素，然后获取 Image，但我无法获取 2D 上下文，所以我寻找了另一种方法。

执行

在任何场景中调用以下函数。

this.game.renderer.snapshotArea(x, y, width, height, callback);

x 和 y 是从显示区域左上角开始的坐标。

（下图中的红色区域为待捕获区域。）

回调函数的参数是一个 Image 元素。

例如，将以下函数设置为回调函数。

（HTML代码底部显示了Phaser3中显示的屏幕截图。）

(image) =>{
    document.body.append(image) 
}

结果

我能够将 Phaser3 上显示的屏幕内容输出为图像。

我用作参考的网站

Snapshot - Notes of Phaser 3

rexrainbow.github.io