Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML5 canvas, scale image after drawing it

I'm trying to scale an image that has already been draw into canvas. This is the code:

      var canvas = document.getElementById('splash-container');
      var context = canvas.getContext('2d');
      var imageObj = new Image();

      imageObj.onload = function() {
        // draw image at its original size
        context.drawImage(imageObj, 0, 0);
      };
      imageObj.src = 'images/mine.jpeg';


        // Now let's scale the image.
        // something like...
        imageObj.scale(0.3, 0.3);

How should I do?

like image 878
Mich Dart Avatar asked Dec 16 '12 16:12

Mich Dart


1 Answers

What robertc says is correct, but if you really wanted to scale an image on a canvas after drawing it for some reason, you could just scale the whole canvas using the CSS width/height properties and that would scale the image without having to redraw it.

like image 103
hobberwickey Avatar answered Sep 20 '22 10:09

hobberwickey