canvas toDataUrl（）不适用于Android设备workarund

Question

我正在开发使用Pixi（2d渲染库）的Cordova混合Web应用程序。应用程序创建一些需要转换并在服务器上保存为PNG图像的画布。

编辑（代码）：

var canvasImg = $('#canvas')[0].toDataURL("image/png");
$("#canvas-img").attr("src", canvasImg );

（这只是我用来测试 toDataURL（）的代码示例

toDataURL（）在运行PC浏览器的Web应用程序中运行良好。它正确转换图像并在＃canvas-img。

中显示图像

但是，当我运行Cordova App（在Android上）或使用Chrome浏览器（在Android上）打开它时， toDataURL（）会创建空像素虚拟图像。

我在Android版本中读到了toDataURL（）的问题＆lt; 2.3，但我的android是版本6.0 !!

• 我的问题与Android设备上的 toDataURL（）问题有关吗？

toDataURL（）是否有解决方法无法在Android设备上运行？

我试图使用：

• https://github.com/AdamMerrifield/todataurl-png-js

• https://github.com/hongru/canvas2image

• https://github.com/gillyb/reimg

（也许我搞砸了一些东西，但那并没有奏效）

如果有人找到解决方法，请提供帮助！

此致 约瑟普布罗兹

Answer 1

最后！成功=）

toDataURL（）中没有问题，除非你的Android版本是＆lt; 2.3。

但是，为了向后兼容，我实施了 todataurl-png-js （以防万一）。

解决方法

我的Pixi渲染器是 PIXI.autoDetectRenderer ，它使用了WebGL渲染器。 这就是为什么 toDataURL（）总会导致空的透明虚拟图像。

• 我将渲染器更改为 PIXI.CanvasRenderer ，现在它将画布转换为图像而没有问题！

我希望这可以帮助有同样问题的人！

:: CHEERS ::

约瑟普布罗兹