0

drawImage を使用して大きな画像 (5M など) をスケーリングすると、結果がひどく見えます。アンチエイリアスを使用して画像をスケーリングできる簡単な方法はありますか? MDNはこれについて次のように述べています。

注: 拡大すると画像がぼやけたり、縮小しすぎると画像が粗くなることがあります。読みやすいままにしておく必要があるテキストが含まれている場合は、スケーリングを行わない方がよいでしょう。

EIDT:画像を 90x90 に拡大したいのですが、コードは次のようになります。

that.avatar_height >= that.avatar_width ?
that.context.drawImage($(this)[0], 86, 2, 90, that.avatar_height*90/that.avatar_width) :
that.context.drawImage($(this)[0], 86, 2, that.avatar_width*90/that.avatar_height, 90);

avatar は、スケーリングされるイメージです。

4

1 に答える 1

1

画像をスケーリングしながら、最初にアップロードされた画像の縦横比を取得します。

/* Calculating aspect ratio */
var imageAspectRatio = imgWidth / imgHeight;

/* Give the needed width and height of the image*/
/*For example you need like this */
var newWidth = 1024;
var newHeight = 768;

if( imgWidth <= 1024 ) {
    var newWidth =  newHeight * imageAspectRatio;
} else if(imgHeight <= 768) {
    var newHeight = newWidth / imageAspectRatio;
} else if( imgWidth >= newWidth ) {
    var newWidth =  newHeight * imageAspectRatio;
} else if(imgHeight >= newHeight) {
    var newHeight = newWidth / imageAspectRatio;
}

これを行うと、アスペクト比を失うことができないため、スケーリングが見栄えがします

于 2012-10-09T05:04:25.797 に答える