gifuct-js icon indicating copy to clipboard operation
gifuct-js copied to clipboard

Draw gif on canvas with fixed size get blurry

Open dim0147 opened this issue 2 years ago • 2 comments

Hi, I draw the gif with canvas fixed size but the image get blur. For example, I want the gif to be drawn at 300x300, I follow this code:

const gif = parseGIF(arrayBuffer);
const frames = decompressFrames(gif, true);
const frame = frames[0];
var dims = frame.dims;

const frameImageData = tempCtx.createImageData(dims.width, dims.height);

// set the patch data as an override
frameImageData.data.set(frame.patch);

// draw the patch back over the canvas
tempCtx.putImageData(frameImageData, 0, 0);

ctx.drawImage(tempCanvas, dims.left, dims.top, 300, 300);

the image is blurry and I'm not sure what I'm missing here, thanks

dim0147 avatar Sep 07 '22 13:09 dim0147

I'm having the same issue. Did you ever resolve @dim0147?

eric-yates avatar Apr 26 '23 02:04 eric-yates

@dim0147 I resolved the issue in my case. Check out this answer I made to another issue and see if it helps!

eric-yates avatar Apr 26 '23 04:04 eric-yates