2

How to resize image already drawed in canvas?

I tried this with no luck (image is showing, but it doesn't resize):

var drawBall = function(mouseX, mouseY){
    ballimg = new Image();
    ballimg.onload = function(){
        ctx.drawImage(ballimg, mouseX-25, mouseY-25);
        ballimg.height = 5;
        throwed = true;

    };
    ballimg.src = "ball2.png";
};

1 Answer 1

3

You can not resize an object which is drawn on the canvas.

What you need to do is redraw your object.

clear the context where the old Ball is located ctx.clearRect(x,y,x2,y2) and draw a new Ball with the new size.

If you want to animate things on the canvas. The way you do that is to keep track of all your objects and redraw the canvas(every single object) for every frame.

3

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.