0

I am using canvas to resize an image but resized image is low quality.Example is here

I searched on google but did not find any easy to understand and straight forward answer.

Please provide a working solution.

Here is my code

$(document).ready(function(){
   var canvas2=document.getElementById("canvas1");
   var ctx=canvas2.getContext("2d");
   ctx.drawImage(document.getElementById("img1"),0,0,200,150);
});
bipen
  • 36,319
  • 9
  • 49
  • 62
user1390378
  • 403
  • 2
  • 7
  • 20
  • Sharing a fiddle is a good start but it doesn't seem to show your problem. – Code Whisperer May 16 '13 at 20:02
  • @Riateche: It does not solve problem. You can try it in fiddle. – user1390378 May 16 '13 at 20:08
  • Well, I think it's hard to solve this problem in all browsers, since there is no standard way to set antialiasing options for `drawImage`. For example, see this [Chromium issue](https://code.google.com/p/chromium/issues/detail?id=7508) about this problem. It's not fixed yet, and there is no solution in comments. Maybe you should let the server do the hard work and resize the image? – Pavel Strakhov May 16 '13 at 20:11
  • Have a look here too: http://stackoverflow.com/questions/2303690/resizing-an-image-in-an-html5-canvas – le_m Mar 24 '17 at 02:32

0 Answers0