user3144678
user3144678

Reputation: 111

resize a canvas with jquery width & height to fit an image dimensions

I have a code thats work with vanilla javascript but not with jquery

this works:

image.src = 'data:image/png;base64,' + <base64>;
c = document.getElementById('canvas-base');
c.height = image.height;
c.width = image.width;            
            ctx = c.getContext("2d");

            image.addEventListener('load', function () {
                ctx.drawImage(image, 0, 0);
                ctx.stroke();
            }, true);

but this isn't working:

c = $('#canvas-base');
c.height(image.height).width(image.width);
            ctx = c[0].getContext("2d");
            image.addEventListener('load', function () {
                ctx.drawImage(image, 0, 0);
                ctx.stroke();
            }, true);

with the jQuery version I get a stretched image.

why?

Upvotes: 2

Views: 240

Answers (1)

Ilan Frumer
Ilan Frumer

Reputation: 32397

That's a known bug:

Just write it like so:

c.attr({"height": image.height , "width": image.width});

Upvotes: 1

Related Questions