みさご解体新書

ピクセルソート

実行例

元画像

N = 300

N = 900

ソースコード

TypeScript

0.jpg / app.ts

解説/アルゴリズム

  1. 画像のピクセルを左から右に、上から下に走査を行い、2. ~ 6. の処理を繰り返して実行する。
  2. 今走査している対象のピクセルを A と呼ぶ。
  3. まだ走査していないピクセルの中から、N 個のピクセルをランダムに抽出する。これを B グループと呼ぶ。
  4. A に隣接しているピクセルをいくつか取り出し、これを C グループと呼ぶ。
  5. B グループのピクセルの中から、C グループの各ピクセルと最も色が近いピクセルを選ぶ。これを D と呼ぶ。
  6. A と D のピクセルの色を入れ替える。

補足

  • 4.の、A に隣接しているピクセルは斜めも入れると 8 個あるが、上記の実行例では上 / 左上 / 左 / 左下のピクセルを対象にしているので結果がモーションブラーに近い形になる。
  • 5.の、最も色が近いピクセルを計算するには、B グループから取り出したピクセルと C グループの各ピクセルとの色の距離を計算し、平均を求める。上記例では、距離の計算にマンハッタン距離を利用している。
  • D の位置にあるピクセルは入れ替えても走査済みにはならない。