GPG雑学：バイリニアフィルタ - 画像を拡大する方法
当然の話ですが、デジタル画像は拡大しても
細かい部分を詳しく見ることはできません。
コンピューターは画像を単純に
色情報の配列として保存しているだけです。
こういう風に色データの配列で作られています。
昔のコンピューターは画面を拡大するとき
隙間の部分を近くの色で塗り替えました。
計算は簡単ですが、結果としてはあまり綺麗ではないです。
ギザギザしている部分が良く見つかります。
コンピューターの性能が良くなってからは
もっと自然に見える拡大方法が出てきました。
従来の拡大画像（左）、現在の拡大画像（右）
今日は画像を拡大する時に良く使われている
バイリニアフィルタ 「Bilinear Filter」 について話します。
名前の意味そのまま訳すると
二重(bi) 線形(linear) 補間(filter) です。
。。。
先ずは 線形補間 について説明します。
例えは、こういうグラフがあるとしましょう
そして、このグラフが何らかの理由で
一部のデータだけ残った場合を考えてみます。
この情報から元のグラフを復元するため
点と点の間を線で繋げます。
これが線形補間です。
線形補間の良い所は、計算がめちゃくちゃ早くて
結果物も計算の軽さに比べて悪くないことです。
これは演算速度を重要視するゲームでは
強力な利点として作用します。
線分の中を計算するには内分点公式を使います。
\(\displaystyle P(x,y) = \frac{n}{m+n}A(x,y) + \frac{m}{m+n}B(x,y)\)
色の場合は赤、緑、青の各要素ごとに分けて
線形補間を行います。
すなわち、バイリニアフィルタ（二重線形補間）は
画像の色情報を２つの軸（横、縦）に対して
線形補間することです。
では、具体的な計算方法をみてみましょう。
※その前、用語の整理をしておきます。
テクセル：加工する前の元イメージ画素のこと
ピクセル：加工後、画面に写っている画素のこと
Step 1.
計算しようとするピクセルを基準で
周りの４つのテクセル情報を取得します。
各テクセルの重心点からの距離を取得
Step 2.
横軸で線形補間を行い、２地点の色を計算します。
A と B を線形補間し、E 地点の色を計算
\(\displaystyle E = \frac{b}{a+b}A + \frac{a}{a+b}B\)
C と D を線形補間し、F 地点の色を計算
\(\displaystyle F = \frac{b}{a+b}C + \frac{a}{a+b}D\)
Step 3.
計算された２地点を縦軸で線形補間して
目的地点のピクセル色を計算します。
E と F を線形補間し、目的地 P の色を計算
\(\displaystyle P = \frac{d}{c+d}E + \frac{c}{c+d}F\)
これでP地点のピクセル色が計算できました。
各ピクセルに対して上記の計算を行うと
こんなふうに綺麗に補間できます。
A、B、C、Dと距離だけで表現してみます。
\(\displaystyle P = \frac{d}{c+d}E + \frac{c}{c+d}F\)
\(\displaystyle = \frac{d}{c+d} \left ( \frac{b}{a+b}A + \frac{a}{a+b}B \right )\)
\(\displaystyle + \frac{c}{c+d} \left ( \frac{b}{a+b}C + \frac{a}{a+b}D \right )\)
\(\displaystyle = \frac{bd}{(a+b)(c+d)}A + \frac{ad}{(a+b)(c+d)}B\)
\(\displaystyle + \frac{bc}{(a+b)(c+d)}C + \frac{ac}{(a+b)(c+d)}D\)
ところで、四角形 「ABCD」 の各部分の面積は
以下になります。
\(S_1 = ac\)
\(S_2 = bc\)
\(S_3 = ad\)
\(S_4 = bd\)
\(S_{TOTAL} (S_T) = (a+b)(c+d)\)
従って、上の式をa,b,c,d部分を面積で置換すると
以下のように綺麗に整理されます。
\(\displaystyle P = \frac{S_4}{S_T}A + \frac{S_3}{S_T}B + \frac{S_2}{S_T}C + \frac{S_1}{S_T}D\)
この式を良く考えると、P地点の色は
各地点A,B,C,Dの色を対角に置かれている
領域の面積ほど割り当ている形です。
この状態で色を混ぜかけるとPピクセルの色になります。
ピクセルPはテクセルBに一番近いので
B色の割当が一番大きい結果になります。
今回も精読いただきありがとうございました。
細かい部分を詳しく見ることはできません。
コンピューターは画像を単純に
色情報の配列として保存しているだけです。
昔のコンピューターは画面を拡大するとき
隙間の部分を近くの色で塗り替えました。
計算は簡単ですが、結果としてはあまり綺麗ではないです。
コンピューターの性能が良くなってからは
もっと自然に見える拡大方法が出てきました。
今日は画像を拡大する時に良く使われている
バイリニアフィルタ 「Bilinear Filter」 について話します。
● バイリニアフィルタとは？ ●
名前の意味そのまま訳すると
二重(bi) 線形(linear) 補間(filter) です。
。。。
先ずは 線形補間 について説明します。
例えは、こういうグラフがあるとしましょう
そして、このグラフが何らかの理由で
一部のデータだけ残った場合を考えてみます。
この情報から元のグラフを復元するため
点と点の間を線で繋げます。
これが線形補間です。
線形補間の良い所は、計算がめちゃくちゃ早くて
結果物も計算の軽さに比べて悪くないことです。
これは演算速度を重要視するゲームでは
強力な利点として作用します。
線分の中を計算するには内分点公式を使います。
色の場合は赤、緑、青の各要素ごとに分けて
線形補間を行います。
すなわち、バイリニアフィルタ（二重線形補間）は
画像の色情報を２つの軸（横、縦）に対して
線形補間することです。
では、具体的な計算方法をみてみましょう。
● バイリニアフィルタの計算仕方 ●
※その前、用語の整理をしておきます。
テクセル：加工する前の元イメージ画素のこと
ピクセル：加工後、画面に写っている画素のこと
Step 1.
計算しようとするピクセルを基準で
周りの４つのテクセル情報を取得します。
ピクセル周りの４テクセル（A、B、C、D）
Step 2.
横軸で線形補間を行い、２地点の色を計算します。
\(\displaystyle E = \frac{b}{a+b}A + \frac{a}{a+b}B\)
C と D を線形補間し、F 地点の色を計算
\(\displaystyle F = \frac{b}{a+b}C + \frac{a}{a+b}D\)
Step 3.
計算された２地点を縦軸で線形補間して
目的地点のピクセル色を計算します。
\(\displaystyle P = \frac{d}{c+d}E + \frac{c}{c+d}F\)
これでP地点のピクセル色が計算できました。
各ピクセルに対して上記の計算を行うと
こんなふうに綺麗に補間できます。
● おまけに ●
上記の計算式を少し整理して、Pの色をA、B、C、Dと距離だけで表現してみます。
\(\displaystyle P = \frac{d}{c+d}E + \frac{c}{c+d}F\)
\(\displaystyle = \frac{d}{c+d} \left ( \frac{b}{a+b}A + \frac{a}{a+b}B \right )\)
\(\displaystyle + \frac{c}{c+d} \left ( \frac{b}{a+b}C + \frac{a}{a+b}D \right )\)
\(\displaystyle = \frac{bd}{(a+b)(c+d)}A + \frac{ad}{(a+b)(c+d)}B\)
\(\displaystyle + \frac{bc}{(a+b)(c+d)}C + \frac{ac}{(a+b)(c+d)}D\)
ところで、四角形 「ABCD」 の各部分の面積は
以下になります。
\(S_1 = ac\)
\(S_2 = bc\)
\(S_3 = ad\)
\(S_4 = bd\)
\(S_{TOTAL} (S_T) = (a+b)(c+d)\)
従って、上の式をa,b,c,d部分を面積で置換すると
以下のように綺麗に整理されます。
\(\displaystyle P = \frac{S_4}{S_T}A + \frac{S_3}{S_T}B + \frac{S_2}{S_T}C + \frac{S_1}{S_T}D\)
この式を良く考えると、P地点の色は
各地点A,B,C,Dの色を対角に置かれている
領域の面積ほど割り当ている形です。
各テクセルを対角線向こうの領域に塗ります。
B色の割当が一番大きい結果になります。
今回も精読いただきありがとうございました。
※ 元ブログから移転された記事です。
コメント
コメントを投稿