キャンバスはJpegの画像サイズを縮小しますが、なぜですか？

drawImage()を使用してJPEG画像をキャンバスに描画した後、canvas.toDataURL()を使用して保存可能なローカル（右側のマウスクリック）にすると、保存されたJPEG画像のファイルサイズは約40％になります。 Jpegを使用している場合にのみそうです。 PNG、GIF（NON-COMPRESSION-FILES）がサイズを上げます。私は、Image-FileをBase64に変換すると、サイズが約130％まで拡大すると思っていました。ですから、キャンバス要素には独自の圧縮機能が組み込まれていると思いますか？もしそうなら、私はそれを無効にすることはできますか？キャンバスはJpegの画像サイズを縮小しますが、なぜですか？

コードは次のようになります。

var img = new Image(); 

img.onload = function() 
{ 
var width = img.width; 
var height = img.height; 
context.drawImage(img, 0, 0,width,height); 
document.images[0].src = canvas.toDataURL('image/jpeg');//<-size = 30,2 KB (30.990 Bytes) 
} 
img.src = "http://www.roomeffect.de/pageslices/RSB.jpg"; //<-original file size = 58,5 KB (59.930 Bytes)

私は問題が何であるかを知らないのですか？

出典

2011-12-03 Okyo

それは問題ではありません。 JPGはロッシーな形式なので、ビットマップに展開されたJPG（画面上に表示されるように）を、そのビットマップを再度圧縮した新しいJPGと同じサイズにすることを期待する必要はありません。元のファイルを保存する場合は、元のファイルを保存します。

出典

2011-12-04 02:42:05 robertc

"...そのビットマップを再度圧縮する"？キャンバスは独自のビットマップを圧縮しますか？ base64は圧縮なしです。何が私を邪魔するのか、圧縮率は約50％で、それはまったくうまくありません。 – Okyo

@Okyo画面に画像が表示されている場合は、現在圧縮されていません。なぜ50％の圧縮サイズが良くないのですか？圧縮の全体的なポイントは、物を小さくすることです。 – robertc

あなたが言っていることは実際に正しいですが、私の意図はこの問題の背後にある技術を理解することでした。とにかくサポートしてくれるよ！ – Okyo

toDataURL関数の2番目のパラメータとしてJPEGの品質を指定できます。 Firefoxのデフォルトの品質は0.92（92％）です。

https://developer.mozilla.org/en/DOM/HTMLCanvasElement

出典

2011-12-03 22:58:44 Neil

速い応答のためのthanx、しかしそれは問題を解決しません、ファイルサイズはまだ減少します！私が指定しているComp-qualityのDoenst問題。 – Okyo

このあなたに最高の結果を与える必要があります：

MDNより引用

document.images[0].src = canvas.toDataURL('image/jpeg', 1);

：

要求されたタイプは、画像/ JPEGまたは画像/ WEBPある場合は、2番目のの引数を、それならば0.0〜1.0の間であり、画像の品質として扱われます。

出典

2011-12-04 20:48:09 Pierre

キャンバスはJpegの画像サイズを縮小しますが、なぜですか？

答えて

関連する問題