canvas 없는 getcontext

document 객체를 이용해서 element를 생성만 하고 추가하지 않으면 되는건가?

// Create a canvas element var canvas = document.createElement('canvas'); canvas.width = 500; canvas.height = 400; // Get the drawing context var ctx = canvas.getContext('2d'); // Then you can do stuff, e.g.: ctx.fillStyle = '#f00'; ctx.fillRect(20,10,80,50);

 

var offscreen = new OffscreenCanvas(256, 256);

[링크 : https://stackoverflow.com/questions/3892010/create-2d-context-without-canvas]

 

크롬에서 확인해보니 먼가 되는것 같긴 하다?

버전 114.0.5735.198(공식 빌드) (64비트)

var offscreen = new OffscreenCanvas(256, 256); undefined ctx = offscreen.getContext("2d") OffscreenCanvasRenderingContext2D {canvas: OffscreenCanvas, globalAlpha: 1, globalCompositeOperation: 'source-over', filter: 'none', imageSmoothingEnabled: true, …}

 

+

OffscreenCanvas() 에는 toDataURL()이 없나보다.

 

+

getContext("2d").canvas 로 하면 굳이 복잡하게 하지 않아도 바로 imf로 떨어지는 듯.

var first = document.getElementById('first').getContext('2d'); var sec = document.getElementById('second').getContext('2d'); // draw on first canvas first.fillStyle = '#07C'; first.fillRect(0, 0, first.canvas.width, first.canvas.height); // draw image on second canvas var img = new Image(); img.src = "http://lorempixel.com/300/300"; img.onload = function() {    sec.drawImage(img, 0, 0, sec.canvas.width, sec.canvas.height);    sec.drawImage(first.canvas, 100, 100, 100, 100); // draw first canvas on a portion of second canvas };

[링크 : https://stackoverflow.com/questions/44574228/copying-and-pasting-one-canvas-inside-another-canvass-corner]