Question

我想在web worker上运行一些asm.js代码生成图像。我想定期将该计算的最新状态合成到用户可见的2D画布上，以及其他一些内容。目前我有代码

使用ImageData构造一个its constructor对象，基于asm.js代码使用的数组缓冲区的一部分，
调用createImageBitmap将ImageData变为ImageBitmap，
transfers表示从工作者到GUI线程的位图和
使用ImageBitmap作为CanvasRenderingContext2D.drawImage的参数。

最近Chrome和Firefox的功能很好，但Safari 9.1.3显然没有createImageBitmap功能。 我如何以适用于Safari的方式执行上述操作？

是否有一些低成本的图像编码，而不是为它创建data:image/png…？是否有其他方法可以将字节数组转换为可以提供给drawImage的内容？

顺便说一下：http://caniuse.com/目前没有列出此功能。如果您希望在此处监视此功能，可以使用a feature request。

如果您希望查看我当前方法的代码，请参阅我的工作人员的相关部分：

var buffer = new ArrayBuffer(bufferSize);
var asm = Module.asm(self, {}, buffer);
var imgBytes = new Uint8ClampedArray(buffer, offset);
var imgData = new ImageData(imgBytes, width, height);
createImageBitmap(imgData).then(function(bmp) { // Not available on Safari!
    postMessage(bmp, [bmp]);
});

这里有相应的GUI线程代码：

var worker = new Worker(‹url of worker›);
worker.onmessage = function(msg) {
    var img = msg.data;
    context2d.drawImage(img, 0, 0, width, height);
};

实际未删节的代码位于this GitHub pull request，但还有很多其他内容与手头的问题无关。

Answer 1

是否有其他方法可以将字节数组转换为可以使用的字节数组提供给<?php echo $_POST["Test"]; ?>？

您可以将drawImage ArrayBuffer对象发布到主线程;在主线程替换时使用Uint8ClampedArray替换.putImageData()。如@Kaiido所示，没有必要在.drawImage()

创建ImageData对象

Worker

在主线程

var imgBytes = new Uint8ClampedArray(buffer, offset);
postMessage(imgBytes.buffer, [imgBytes.buffer]);

http://plnkr.co/edit/N0v1YQHQX2rdFfHcOKeR?p=preview

Safari上的createImageBitmap替代方案

1 个答案: