ビット論理演算でパターンを描く(1)

2011 / 09 / 19 by
Filed under: AS 
Bookmark this on Delicious
[`livedoor` not found]
[`yahoo` not found]

コンピュータ・ワンダーランド―驚異と悦楽の電脳迷路」で得た知見発表シリーズ第3弾にして最終回。

P105 から始まる第13章「美とビット」では、ビット論理演算によってパターンを描く方法が紹介されています。いわく……

AND や OR のような論理演算を使う単純この上ない算術計算を行なうだけで、拡大対称性を持った非常に複雑なパターンが得られる。

そして、その単純この上ない算術計算の例として、以下の式が書かれています。


ci, j = i OR j

i はX座標値、j はY座標値、そして c は右辺の計算により得られた値を示しています。
ようするに、とある矩形領域を1ピクセルずつ走査して、各ピクセルごとに、そのX座標値とY座標値の数値でビット論理和計算をする、ってことですね。
ところでコンピュータが扱う色は256諧調ですが、この計算式だと矩形領域のサイズが大きいと、論理和の計算結果が256を超える場合もあり得ます。

さてどうする。

256を超える値含む集合を256で正規化する方法はいろいろ考えられますが、ここでは「剰余を使う」を採用しています。
ただし、ある効果を得るために、256の剰余ではなく、255の剰余を使う、ということをあえてしていました。

ActionScript で書くとこんな感じですね。

for (var y:int; y<stage.stageHeight; y++) {
  for (var x:int; x<stage.stageWidth; x++) {
    var c:uint = (x | y) % 255;
    var color:uint = c << 16 | c << 8 | c;
  }
}

で、描かれるパターンが↓

ビット論理演算子によるパターン描画 – wonderfl build flash online

なんとシェルピンスキー・ガスケットが浮き出ているじゃあありませんか! ふっしぎー!

さてこのパターン、255の剰余を使ったのでそのパターン周期も255です。まぁ色の階調と合わせる意味で、その周期を256と考えてみます。
で、このパターン描画の面白さを理解するためには、最低でも2周期分の512ピクセルが必要らしい。
と言うのも、2周期分のシェルピンスキー・ガスケットの線が1周期分のそれよりも太くなっているのです。wonderfl の SWF 表示領域は 465 * 465 なので、右と下が欠けてしまって分かりづらいですが。

コードをダウンロードしてステージサイズを 512 * 512 や768 * 768 にしてコンパイルしてみることをお奨めします。3周期分を表示させると、さらに太っていることが確認できます。

このコードでは以下の計算で得られるパターンを切り替えて表示します。否定(~ NOT)はちょっと他のビット論理演算子とは傾向が違うようなので、除外します。

  1. x & y(ビット論理積 AND)
  2. x | y(ビット論理和 OR)
  3. x ^ y(ビット排他的論理和 XOR)

色はグレイトーンとカラフルのふたつを切り替えられます。



Comments

Tell me what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!





WP-SpamFree by Pole Position Marketing