如何将pixijs内容保存为图像

Question

假设我有一个像这样的 pixijs 应用程序https://codesandbox.io/s/o3qfi

我需要将pixijs渲染的内容保存在canvas中作为截图。

我尝试访问 canvas 之类的

app.renderer.view.toDataURL("image/png", 1.0)

并且还通过

document.getElementsByTagName('canvas')[0].toDataURL("image/png", 1.0)

但是它们都返回一个空的透明图像，而不是由 pixjs 呈现的 canvas 内容

Answer 1

您需要从renderer中extract它。

例如，如果要打印stage ：

let blob = app.renderer.plugins.extract.image(app.stage).src;
window.location.href = blob.replace("image/png", "image/octet-stream");

将下载以下图像：