読者です 読者をやめる 読者になる 読者になる

HTML Canvasで拡大縮小

HTML Canvasで画像の拡大縮小を行うにはscaleメソッドを使ってdrawImageすればいいのですが、暇つぶしにニアレストネイバー法、バイリニア法による画素サンプリングを書いてみました。もちろん、重くて使い物にはなりません。ImageDataを使うため、Firefox 3、Opera 9.6以降専用です。

ニアレストネイバー法はズームしたときに一番近くの点をサンプリングする方法。高速ですが汚いです。バイリニア法は近傍4点の加重平均値をとる方法です。JavaSctipt + HTML Canvasではかなり重い処理になってしまいます。他にバイキュービック法というサンプリング方法があります。こちらはバイリニア法よりも高品質ですが計算量も多くなります。


scaleメソッドとdrawImageのサンプル