1

我正在尝试从具有 alpha 值（半透明的东西）的画布上下载 png，但是每次我下载画布时，所有 alpha 通道都会ff由于某种原因重置回。这是我的代码：

const download = (canvas, filename) => {
    const link = document.createElement('a');
    link.download = `${filename}.png`;
    link.href = canvas.toDataURL("image/png");
    console.log(link.href);
    link.click();
};

const drawAndDownloa = str => {
    const canvas = document.createElement("canvas");
    canvas.width = pixels.length;
    canvas.height = 1; // intentionally small
    const ctx = canvas.getContext("2d");
    
    // pixels is an array of "rrggbbaa" strings
    pixels.forEach((rgba, i) => {
        const r = parseInt(rgba.slice(0, 2), 16);
        const g = parseInt(rgba.slice(2, 4), 16);
        const b = parseInt(rgba.slice(4, 6), 16);
        const a = parseInt(rgba.slice(6, 8), 16);

        ctx.fillStyle = `rgba(${r}, ${g}, ${b}, ${a})`;
        ctx.fillRect(i, 0, 1, 1);
    });

    download(canvas, str.replace(/\W/g, "_"));
};

我知道您需要 png-24 才能拥有 alpha 通道，但我现在知道如何下载到 png-24 中。我也不知道如何检查它是否是 png-24。

4

0 回答 0