imageData.dataにバッファ位置を割り当てる代わりに、ループ

Question

で値を割り当てるIが作業emscripten私は私のJavaScriptコード

const int COMP = 4; 
long createBitmap(int DIM) 
{ 
    srand(NULL); 
    // create buffer 
    long buffer = EM_ASM_INT(
    { 
     var buffer = Module._malloc($0 * 1); 
     return buffer; 
    }, DIM*DIM*COMP); 

    uint8_t* bitmap = (uint8_t*)buffer; 

    //just randomly fill the buffer 
    for (int i = 0; i < DIM*DIM*COMP; i++) 
    { 
     if (i%4==3) 
      bitmap[i] = 128; 
     else 
      bitmap[i] = rand()%256; 
    } 

    return buffer; 
} 

とJavaScriptで、私は、次のコードを持っているに渡すC++でビットマップを作成する場合：

var dim = 1080; 
var buffer = Module.createBitmap(dim); 
var c = document.getElementById("bitmap"); 
var ctx = c.getContext("2d"); 
var imgData = ctx.createImageData(dim,dim); 
for (var i = 0; i < dim*dim*4; i++) { 
    imgData.data[i] = Module.HEAPU8[buffer+i]; 
} 

ctx.putImageData(imgData, 0, 0) 

これはうまく動作しますが、私はimgData.dataアレイへのバッファのすべての要素を割り当てるためにループを好きではありません。私は、C++で使用するuint8_tデータ型がimgData.dataのUint8ClampedArrayに対応していることを知っています。私にはこれはバッファーの始めをこのimgData.dataに割り当てる良い機会のようで、何もコピーする必要はありません - これは可能ですか？

Answer 1

私はemscripten googleグループからthis answerを取得しました。

答えは実際には非常に簡単です。

var mappedBuffer= new Uint8ClampedArray(Module.HEAPU8.buffer, buffer, dim * dim * 4) 

のでHEAPU8.bufferは、基礎となるバッファにアクセスし、それを私はUint8ClampedArray型指定された配列を作成することができます。

次に、あなたは単に

imgData.data.set(mappedBuffer) 
ctx.putImageData(imgData, 0, 0)