画像リサイズによって得られる画像の荒さを解消したい

576 views
Skip to first unread message

gen

unread,
Nov 3, 2012, 2:15:55 AM11/3/12
to google-app-...@googlegroups.com
画像のサムネイルを作成するために、画像を小さくリサイズする必要があります。
しかし、リサイズによって得られる画像の荒さが酷い(アンチエイリアスがかかっていないようなギザギザな状態。スムーズに縮小されていない感じ)ので、これを解消する方法をお尋ねしたく、このトピックを立てました。

■問題の再現性について:
全ての画像や全ての変換について問題であると感じる程に荒くなるわけでありません。
いくつかの画像およびいくつかサイズで検証した結果、およそ次のような傾向が見られました。(程度問題であるため、傾向としてしか記述できません)

【傾向1】
元画像のサイズに依存しない。
例えば、2000px✕2000pxの画像→100px✕100pxの画像の変換と、600px✕600pxの画像→100px✕100pxの変換では、どちらも同程度の荒さが発生します。

【傾向2】
変換先画像のサイズに依存する。
例えば、2000px✕2000pxの画像→1000px✕1000pxの画像の変換と、2000px✕2000pxの画像→100px✕100pxの変換では、後者がより荒さが目立ちます。


■すでに行った対策
品質の設定と画像形式はいろいろ試しましたが全く変化は見られませんでした。
OutputSettings settings = new OutputSettings(OutputEncoding.PNG);
OutputSettings settings = new OutputSettings(OutputEncoding.JPEG);
settings.setQuality(100);
settings.setQuality(70);

おそらく、原因は画像リサイズのアルゴリズムに起因すると考えられます。


■他の対策方法
javaで実装可能なおすすめのアルゴリズムなどありましたら教えて下さい。
また、自分で画像リサイズのアルゴリズムを実装するか、他のライブラリを借用するなど、他に方法があったとして、その実現可能性とはどのようなものとなるでしょうか。
例えば、スムーズに画像を縮小するようなアルゴリズムはCPU負荷が激増するため現実的でない、というような知見はあったりしないでしょうか?
その辺りも含め、この問題にどう対処すべきでしょうか?

gen

unread,
Nov 5, 2012, 9:12:54 AM11/5/12
to google-app-...@googlegroups.com
自己解決しました。
一応解決方法をまとめておきます。

■要約
やりたいこと:GAEでサムネイル用の画像を作りたかった
問題:GAEに用意されたAPI使ってサイズを縮小すると、荒くなってとても汚くなった
解決:クライアント側で処理してアップロード


■環境
GAE/J
slim3使用


■処理の流れ
1:GAEで普通にアップロード。blobstoreに元画像が保存される
2:クライアント側(Javascript)で元画像を読み込んで、リサイズ処理をしてサムネ画像を生成&アップロード
3:サムネ画像をblobstoreに保持

■詳細
2については、最初にこのページにたどり着いたが、アルゴリズムが悪いらしく、非常に処理に時間がかかって問題となった。
その後、優れたライブラリにたどり着いた。
これで、2の処理はうまくいった。

最後に、どうやってcanvasの画像をblobstoreに保存するのかという問題が残った。
まず、js側の処理は下のを参考。
app engine側は、こういう感じ。
FileService fileService = FileServiceFactory.getFileService();
AppEngineFile file = fileService.createNewBlobFile("image/jpeg");
boolean lock = true;
FileWriteChannel writeChannel = fileService.openWriteChannel(file, lock);
// This time we write to the channel using standard Java
writeChannel.write(ByteBuffer.wrap(Base64.decode(画像データの文字列)));
// Now finalize
writeChannel.closeFinally();
BlobKey key = fileService.getBlobKey(file);



2012年11月3日土曜日 15時15分56秒 UTC+9 gen:

najeira

unread,
Nov 5, 2012, 8:54:28 PM11/5/12
to google-app-...@googlegroups.com
najeiraです。

Blobstoreに保存された画像は、リサイズしたものをBlobstoreのインフラから直接配信できます。
Images APIのgetServingUrlというメソッドを使うと、リサイズされた画像のURLを得ることができます。




2012年11月5日月曜日 23時12分54秒 UTC+9 gen:
Reply all
Reply to author
Forward
0 new messages