畳み込みフィルター

ConvolutionFilter クラスを使用すると、BitmapData オブジェクトまたは表示オブジェクトにぼかし、エッジ検出、シャープ、エンボス、べベルなどの幅広い画像変換を適用することができます。

概念的には、畳み込みフィルターでソースイメージのピクセルが 1 つずつ処理され、処理対象のピクセルとその周囲のピクセルの値を使用して、その対象ピクセルの最終的なカラーが決定されます。 マトリックスは、数値の配列として指定されており、個々の隣接ピクセルの値が最終結果の値にどの程度影響するかを示します。

ここでは、最もよく使用される種類のマトリックスである 3 × 3 のマトリックスについて考えてみます。 このマトリックスには、9 個の値が含まれています。

N    N    N 
N    P    N 
N    N    N

畳み込みフィルターを特定のピクセルに適用する場合、そのピクセル自体（この例では「P」）のカラー値を参照すると共に、周囲のピクセル（この例では「N」）の値も参照します。ただし、マトリックス内に値を設定することによって、結果として得られるイメージに対する影響の優先度をピクセルごとに指定することができます。

例えば、次のマトリックスが畳み込みフィルターによって適用されると、イメージは適用前とまったく同じ状態のままになります。

0    0    0 
0    1    0 
0    0    0

イメージが変更されない理由は、最終的なピクセルカラーが決定されるときに、元のピクセルの値の相対的な強さが 1 になるのに対し、周囲のピクセルの値の相対的な強さが 0 になるためです。つまり、周囲のピクセルの色は最終イメージに影響しません。

これと同様の理由で、次のマトリックスの場合にはイメージが左方向に 1 ピクセル分シフトすることになります。

0    0    0 
0    0    1 
0    0    0

この場合、処理対象のピクセル自体は、最終イメージでこのピクセルの位置に表示されるピクセルの最終値に影響しません。右隣にあったピクセルの値だけが、その表示されるピクセルの最終値の決定に使用されます。

ActionScript でマトリックスを作成するときには、値を含む Array インスタンスと、マトリックスの行数および列数を指定する 2 つのプロパティとを組み合わせたものとして作成します。 次の例では、イメージをロードし、イメージのロードが完了したら前述のマトリックスを使用して畳み込みフィルターをそのイメージに適用します。

// Load an image onto the Stage. 
var loader:Loader = new Loader(); 
var url:URLRequest = new URLRequest("http://www.helpexamples.com/flash/images/image1.jpg"); 
loader.load(url); 
this.addChild(loader); 
 
function applyFilter(event:MouseEvent):void 
{ 
    // Create the convolution matrix. 
    var matrix:Array = [0, 0, 0, 
                                     0, 0, 1, 
                                     0, 0, 0]; 
     
    var convolution:ConvolutionFilter = new ConvolutionFilter(); 
    convolution.matrixX = 3; 
    convolution.matrixY = 3; 
    convolution.matrix = matrix; 
    convolution.divisor = 1; 
     
    loader.filters = [convolution]; 
} 
 
loader.addEventListener(MouseEvent.CLICK, applyFilter);

マトリックスで 1 または 0 以外の値を使用するとどのような結果になるかはこのコードからはわかりません。例えば、上と同じマトリックスで右側の位置の 1 の代わりに数値 8 を使用した場合には、同じアクションが実行されます。つまり、左方向にピクセルがシフトします。 また、イメージのカラーが影響を受け、イメージが 8 倍明るくなります。 これは、最終的なピクセルカラーの値は、マトリックスの各値と元の各ピクセルのカラーを乗算し、値を合計した後、フィルターの divisor プロパティに指定されている値で除算することによって算出されるためです。例に示したコードでは、 divisor プロパティは 1 に設定されています。基本的に、カラーの明度を元のイメージとほぼ同じ明度のままにする場合は、除数をマトリックスの各値の合計と等しくする必要があります。このように、値の合計が 8 になるマトリックスを使用し、除数を 1 にした場合には、結果として得られるイメージは元のイメージよりも約 8 倍明るくなります。

ここで紹介したマトリックスの効果は目立つものではありませんが、別のマトリックス値を使用すれば様々な効果を生成することができます。次に、3 × 3 マトリックスを使用して各種効果を生成する場合の標準的なマトリックス値の組み合わせをいくつか示します。

• 基本的なぼかし（除数は 5）：

       0 1 0 
       1 1 1 
       0 1 0

• シャープ（除数は 1）：

       0, -1, 0 
      -1, 5, -1 
       0, -1, 0

• エッジ検出（除数は 1）：

       0, -1, 0 
      -1, 4, -1 
       0, -1, 0

• エンボス効果（除数は 1）：

      -2, -1, 0 
      -1, 1, 1 
       0, 1, 2

  これらの効果を使用すると、ほとんどの場合、除数は 1 になります。 これは、負のマトリックス値と正のマトリックス値を足すと 1 になるからです（エッジ検出の場合は 0 ですが、 divisor プロパティ値は 0 になりません）。

Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。