Question

我有画布的图像数据：

myImage = ctx.getImageData(0, 0, 640, 480);

我想通了，我可以创建新的Uint8Array并使用set()复制imagedata。这是一个有效的例子：

var numBytes = width * height * 4;
var ptr= Module._malloc(numBytes);
var heapBytes= new Uint8Array(Module.HEAPU8.buffer, ptr, numBytes);
heapBytes.set(new Uint8Array(myImage.data));
_processImage(heapBytes.byteOffset, width, height);
myImage.data.set(heapBytes);

但是，不幸的是，每个.set()操作都比处理图像慢得多，上面的代码比JS实现慢！

所以，我想处理图像而不复制它。我可以通过这种方式成功地直接读取和写入数据：

Module.HEAPU8.set(myImage.data, myImage.data.byteOffset);
_processImage(myImage.data.byteOffset, width, height);
myImage.data.set(new Uint8ClampedArray(Module.HEAPU8.buffer , myImage.data.byteOffset , numBytes));

速度更快，但第一个.set()仍需要17毫秒才能执行。

c ++函数原型是：

extern "C" {

    int processImage(unsigned char *buffer, int width, int height)
    {
    }

}

有没有办法在不使用set()的情况下将数组传递给C ++？只是告诉c ++数据在内存中的位置，并允许修改它？

Answer 1

告诉c ++数据在内存中的位置，并允许修改它？

从v1.34.12开始，Emscripten有一个SPLIT_MEMORY选项，你可以告诉Emscripten使用现有缓冲区作为其内存空间的一部分，将其分成大小均匀的块

例如，您可以从画布中获取缓冲区

@NonNull
@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {

    View v = inflater.inflate(R.layout.custom_layout, null);

    initDialogUi(v);

    final AlertDialog d = new AlertDialog.Builder(activity, R.style.AppCompatAlertDialogStyle)
            .setTitle(getString(R.string.some_dialog_title))
            .setCancelable(true)
            .setPositiveButton(activity.getString(R.string.some_dialog_title_btn_positive),
                    new DialogInterface.OnClickListener() {
                        @Override
                        public void onClick(DialogInterface dialog, int which) {
                            doSomething();
                            dismiss();
                        }
                    })
            .setNegativeButton(activity.getString(R.string.some_dialog_title_btn_negative),
                    new DialogInterface.OnClickListener() {
                        @Override
                        public void onClick(DialogInterface dialog, int which) {
                            dismiss();
                        }
                    })
            .setView(v)
            .create();

    // change color of positive button         
    d.setOnShowListener(new DialogInterface.OnShowListener() {
        @Override
        public void onShow(DialogInterface dialog) {
            Button b = d.getButton(DialogInterface.BUTTON_POSITIVE);
            b.setTextColor(getResources().getColor(R.color.colorPrimary));
        }
    });

    return d;
}

然后，修改explanation of split memory中的示例，告诉Emscripten将此缓冲区用作其内存空间的一部分

var existingBuffer = myImage.data.buffer;
var bufferSize = existingBuffer.byteLength; // Must be equal to SPLIT_MEMORY

然后将指向块的指针传递给C ++函数。

var chunkIndex = 2; // For example
allocateSplitChunk(chunkIndex, existingBuffer);

然而存在问题和限制

必须将Emscripten内存空间拆分为与画布图像数据缓冲区大小完全相同的块。
对于所有Emscripten编译的代码，显然都有serious performance implications，这可能会使这个代码比原始代码更差。

如何将canvas imageData传递给emscripten c ++程序而不复制它？

1 个答案: