HTML Canvasで画像の拡大縮小を行うにはscaleメソッドを使ってdrawImageすればいいのですが、暇つぶしにニアレストネイバー法、バイリニア法による画素サンプリングを書いてみました。もちろん、重くて使い物にはなりません。ImageDataを使うため、Firefox 3、Opera 9.6以降専用です。
- https://nullpon.moe/dev/sample/canvas/nearest.html
- https://nullpon.moe/dev/sample/canvas/bilinear.html
ニアレストネイバー法はズームしたときに一番近くの点をサンプリングする方法。高速ですが汚いです。バイリニア法は近傍4点の加重平均値をとる方法です。JavaSctipt + HTML Canvasではかなり重い処理になってしまいます。他にバイキュービック法というサンプリング方法があります。こちらはバイリニア法よりも高品質ですが計算量も多くなります。
scaleメソッドとdrawImageのサンプル