Question

我正在尝试createImageBitmap（imgdata，0,0,500,500），代码如下：

function draw(imgi) {
    console.log('drawing');
    let data = imgi.data;
    // console.log(data); --> the data of the real image
    data = core.clip(data, 100, 210);
    // console.log(data); --> the clipped array with minimum value of 100 and maximum value of 210
    data = core.form_arr(data, 'uint8clamped');
    console.log(data); // --> Converting to Uint8Clamped array
    let img = new ImageData(data, 500, 500);
    console.log(img.data); // --> converts the clamped array into image data
    createImageBitmap(img, 0, 0, 500, 500)
        .then(im => {
            console.log(im); // --> This is where the error is the im is all zeroes clamped array
            ctx2.drawImage(im, 500, 500);
            console.log(ctx2.getImageData(0, 0, 500, 500).data);
        });
}

createImageBitmap promise使用全部为零的限幅数组解析，但我使用的imagedata并非全为零。

这是什么原因？

Answer 1

这一行：

ctx2.drawImage(im, 500, 500);

会在可能位于画布区域外的位置（500,500）处绘制图像吗？（或至少你在这里测试的区域：console.log(ctx2.getImageData(0, 0, 500, 500).data);）

尝试将其更改为例如：

ctx2.drawImage(im, 0, 0);

createImageBitmap（）将图像数据转换为全零

1 个答案: