>source

window.onload= function() {
var ctx= document.getElementById("canvas").getContext("2d");
ctx.fillStyle= "black";
ctx.fillRect(180, 180, 40, 40);
}
function saveWithBackground(canvas) {
var link= document.createElement("a");
link.href= canvas.toDataURL();
link.download= "download.jpg";
link.click();
}

#canvas {
border: 1px solid black;
background-color: red;
}

<canvas id="canvas" width="400" height="400"></canvas><button onclick="saveWithBackground(document.getElementById('canvas'))">Save</button>

그러나 이것은 배경과 함께 이미지를 저장하지 않습니다.

배경색으로 저장하는 방법을 알려주실 수 있나요?

첫 번째 그리기로 배경색으로 캔버스를 채웁니다.

Teemu2022-02-08 19:30:13
  • 답변 # 1

    캔버스에서 배경을 설정해야 합니다.

    window.onload= function () {
        var ctx= document.getElementById("canvas").getContext("2d");
        ctx.fillStyle= "red";
        ctx.fillRect(0, 0, 400, 400);
        ctx.fillStyle= "black";
        ctx.fillRect(180, 180, 40, 40);
    }
    

  • 이전 두 행에 걸쳐 있는 CSS Flex 항목
  • 다음 ios : 내 앱에서 직접 에어태그를 감지하는 방법