サイトトップ

Director Flash 書籍 業務内容 プロフィール

Macromedia Flash非公式テクニカルノート

BitmapData.perlinNoise()メソッド

ID: FN0510001 Product: Flash

Platform: All
Version: Flash 8

シンタックス[*1]
public perlinNoise(baseX:Number, baseY:Number, numOctaves:Number, randomSeed:Number, stitch:Boolean, fractalNoise:Boolean, [channelOptions:Number], [grayScale:Boolean], [offsets:Object]) : Void

[訳者注*1] 従来のシンタックスの記述にしたがえば、つぎのとおりです。

myBitmapData.perlinNoise(baseX, baseY, numOctaves, randomSeed, stitch, fractalNoise, [channelOptions, grayScale, offsets])

また、戻り値はVoidで型指定されていますので、「なし」になります。

引数
baseX:Number - x方向に使用する周波数。たとえば、64×128のイメージサイズに対するノイズを生成するには、baseX値として64を渡します。

baseY:Number - y方向に使用する周波数。たとえば、64×128のイメージサイズに対するノイズを生成するには、baseY値として128を渡します。

numOctaves:Number -オクターブまたは個別のノイズ関数の数。ノイズ関数は、ノイズを作成するために合成されます。

randomSeed:Number - ランダムシード(乱数の種)として使用する数値。他の引数がすべて同じままのとき、ランダムシード値を変えることで異なった疑似乱数の結果が生成できます。Perlinノイズ関数はマッピング関数で、真の乱数生成関数ではありません。そのため、同じランダムシードからは、毎回同じ結果が作成されます。

stitch:Boolean - ブーリアン(論理)値。値がtrueのとき、メソッドはイメージの変遷するエッジ部分をスムーズにして、ビットマップの塗りをタイル上に並べたとき,継ぎ目のないテクスチャを作成するようにします。

fractalNoise:Boolean - ブーリアン(論理)値。値がtrueのとき、メソッドはフラクタルノイズを生成します。それ以外であれば、乱流を生成します。乱流のあるイメージは、グラデーションの中に視覚的な不連続性を有します。その不連続性は、シャープな視覚効果に近づけ、炎や海の波のような効果を与えます。

channelOptions:Number [省略可能] - ひとつ以上のカラーチャネル数を示す数値。この値を決めるには、4つのカラーチャンネル値のいずれかを使うか、それらを合成します。1が赤(Red)、2は緑(Green)、4は青(Blue)、そして8はアルファ(Alpha)です。チャネル値は、ビット和演算子(|)を使って合成することができます。たとえば、赤と緑のチャネルは、「1 | 2」というコードを用いることにより組合わせることが可能です[*2]。

grayScale:Boolean [省略可能] - ブーリアン(論理)値。値がtrueのとき、RGB(赤緑青)の各カラーチャネルが同一の値になり、グレースケールイメージが作成されます。アルファチャネルの値は、この引数値がtrueでも影響ありません。デフォルト値は、falseです。

offsets:Object [省略可能] - Pointインスタンスの配列で、各ポイントはそれぞれのオクターブにおけるxおよびyのオフセット値に対応します。オフセット値を操作すると、Perlinノイズイメージのレイヤーをスムーズにスクロールできます。オフセット配列内の各ポイントは、指定されたオクターブノイズ関数に影響を与えます。

[訳者注*2] 2の累乗(2^0=1、2^1=2、2^2=4、2^3=8。なお、記号「^」は累乗を表わす)は、1となるビットの桁数が他の数値と重複しません(スクリプト001)ので、単純に足し算したのと同じ値になります(「1 | 2」は3です)。逆にいえば、結果が足し算で計算でき、その値が他のどの組合わせとも重複しない(値が3になるのは、1と2の組合わせ以外にありません)ように、2の累乗が定数として選ばれたといえます。

スクリプト001■2の累乗を2進法に変換

// 各定数値を2進法に変換した結果
trace((1).toString(2));   // [出力]: 1
trace((2).toString(2));   // [出力]: 10
trace((4).toString(2));   // [出力]: 100
trace((8).toString(2));   // [出力]: 1000

説明
Perlinノイズイメージを生成します。

Perlinノイズの生成アルゴリズムは、(オクターブと呼ばれる)個別のランダムノイズ関数を補間・合成して、ひとつの関数をつくり、自然な表現のランダムノイズを生成します。音楽のオクターブと同じく、各オクターブ関数は周波数がひとつ前の関数の2倍になります。Perlinノイズは、「ノイズのフラクタル和」と説明されてきました。それは、複数のノイズデータのセットを、異なった詳細レベルで合成するからです。

Perlinノイズ関数は、自然現象や風景などをシミュレートして、木目や雲、山脈などを作成するのに用いることができます。多くの場合、Perlinノイズ関数のアウトプットはそのまま表示するのでなく、別のイメージを強調したり、イメージに擬似的なランダムバリエーションを加えるために使用されます。

単純なデジタルランダムノイズ関数は、荒れてコントラストのきつい部分のあるイメージを作成することが少なくありません。Perlinノイズアルゴリズムは複数のノイズ関数をブレンドし、それぞれの関数は異なった詳細レベルを操作することができます。その結果、このアルゴリズムでは、隣り合うピクセル間の値のばらつきを小さく抑えることができます。

注記: Perlinノイズアルゴリズムは、開発者のKen Perlin氏にちなんで命名されました。氏はその開発に先立ち、1982年の映画「トロン」[*3]のコンピュータグラフィックスを作成しています。

[訳者注*3] 映画については、「映画TRON」をご参照ください。


つぎの例は、PerlinノイズをBitmapDataオブジェクトにどのように適用するかを示します[*4][*5][*6]。

import flash.display.BitmapData;

var bitmapData_1:BitmapData = new BitmapData(100, 80, false, 0x00CCCCCC);
var bitmapData_2:BitmapData = new BitmapData(100, 80, false, 0x00FF0000);

var mc_1:MovieClip = this.createEmptyMovieClip("mc", this.getNextHighestDepth());
mc_1.attachBitmap(bitmapData_1, this.getNextHighestDepth());

var mc_2:MovieClip = this.createEmptyMovieClip("mc", this.getNextHighestDepth());
mc_2.attachBitmap(bitmapData_2, this.getNextHighestDepth());
mc_2._x = 101;

mc_1.onPress = function() {
  var randomNum:Number = Math.floor(Math.random()*10);
  bitmapData_1.perlinNoise(100, 80, 6, randomNum, false, true, 1, true, null);
};

mc_2.onPress = function() {
  var randomNum:Number = Math.floor(Math.random()*10);
  bitmapData_2.perlinNoise(100, 80, 4, randomNum, false, false, 15, false, null);
};


[訳者注*4] 動的に配置されたふたつのMovieClipをそれぞれクリックすると、各インスタンスの含むイメージにPerlinノイズが適用されます。

[訳者注*5] おもな引数の値を変えて、Perlinノイズの生成をシミュレートしてみます。

    イメージをクリックすると、ランダムシード値を変更して、新たなPerlinノイズを生成します。
  • Base size: イメージサイズに対する比率を、拡大・縮小します。拡大は2倍、縮小は1/2のサイズ変更を、繰返します。つまり、イメージサイズ×(2の累乗)になります。指数値0が1倍で、イメージサイズと同一値の設定です。
  • Octarves: ノイズを作成するオクターブ数です。
  • Fractal: フラクタルノイズと乱流を切換えます。
  • Channels: 使用するRGBチャネルを指定します。
  • GrayScale: グレースケールイメージを生成します。

[訳者注*6] つぎのサンプルは、offsetsの配列を指定したうえで、そのポイントの値をMovieClip.onEnterFrameイベントで動的に変更しています(LiveDocs:[perlinNoise (BitmapData.perlinNoise method)]のComment欄に紹介されたFrancis Cheng氏のスクリプト)。

スクリプト002■オフセット値をonEnterFrameイベントで動的に変更する

import flash.display.BitmapData;
import flash.geom.Point;

var bitmapData_1:BitmapData = new BitmapData(100, 80, false, 0x00FF0000);
var randomNum:Number = Math.floor(Math.random()*10);
var mc_1:MovieClip = this.createEmptyMovieClip("mc", this.getNextHighestDepth());
mc_1.attachBitmap(bitmapData_1, this.getNextHighestDepth());

// 引数offsets配列の内容
var point1:Point = new Point(10, 10);
var point2:Point = new Point(50, 20);
var perlinOffset:Array = [point1, point2];

onEnterFrame = function () {
  perlinOffset[0].x++;
  perlinOffset[1].y++;
  bitmapData_1.perlinNoise(100, 80, 4, randomNum, false, false, 15, false, perlinOffset);
};

Player
ActionScript 1.0/Flash Player 8以降。

出典
[ActionScript 2.0 Language Reference] > [ActionScript classes] > [BitmapData (flash.display.BitmapData)] > [perlinNoise (BitmapData.perlinNoise method)]

参考
Perlin Noise
t-pot「Perlinノイズ

_____

作成者: 野中文雄
作成日: 2005年10月4日


Copyright © 2001-2006 Fumio Nonaka.  All rights reserved.