Converting a memory location to an ArrayBuffer

[Philipp Gloor]

I'm wondering if it is possible to convert memory location to an ArrayBuffer.

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] = 255;
        else
            bitmap[i] = rand()%256;
    }

    return buffer;
}

This is the C++ code where I just fill an array with random RGB values. 

And I can display the whole thing without problems in javascript

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)

What I don't like here though is the fact that I have to loop through all the bitmap components separately and assign them to the imgData.data array. This array is a Uint8ClampedArray and I was wondering if there is a way to convert this 'buffer' variable to an ArrayBuffer of type Uint8ClampedArray which would save a lot of copying. Especially since there could be several bitmaps passed per second.

[Brion Vibber]

Yes, you can create a new Uint8ClampedArray using the same backing buffer:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays#Multiple_views_on_the_same_data

Be warned that IE 10 is missing Uint8ClampedArray if that's a compatibility issue for you. (10 should be pretty rare these days, 11 is fine iirc)

-- brion

--
You received this message because you are subscribed to the Google Groups "emscripten-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to emscripten-discuss+unsub...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Philipp Gloor]

But what would the code look like for this? Because the variable buffer is basically just a number nothing else. Creating a new view needs an ArrayBuffer but I don't have one, as far as I understand.

To unsubscribe from this group and stop receiving emails from it, send an email to emscripten-discuss+unsubscribe@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to a topic in the Google Groups "emscripten-discuss" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/emscripten-discuss/-Ac-XNpVIL8/unsubscribe.
To unsubscribe from this group and all its topics, send an email to emscripten-discuss+unsub...@googlegroups.com.

[Charles Vaughn]

Module.HEAPU8.buffer will give you the underlying buffer

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

To unsubscribe from this group and stop receiving emails from it, send an email to emscripten-discuss+unsub...@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[Philipp Gloor]

This is fantastic, thank you Charles.

To unsubscribe from this group and stop receiving emails from it, send an email to emscripten-discuss+unsubscribe@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to a topic in the Google Groups "emscripten-discuss" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/emscripten-discuss/-Ac-XNpVIL8/unsubscribe.

To unsubscribe from this group and all its topics, send an email to emscripten-discuss+unsubscribe@googlegroups.com.