読者です 読者をやめる 読者になる 読者になる

paper.jsでライフゲーム

ライフゲーム

paper.jsによるライフゲーム

マウスクリックでランダムな初期配置。

CoffeeScript と Canvas で作成するコンウェイのライフ・ゲームと今月のWEB+DB PRESSライフゲームの解説が載ってたので、paper.jsで作ってみた。

少しいじって元の位置によって、それぞれの円の色が違うようにした。復活した時に周囲の色の平均値(hue、saturationのみ)になる。

(10/02)計算が間違っていたので修正


ソース

var width = view.viewSize.width;
var heigt = view.viewSize.height;
var circleSize = 8;
var widthNum = width/circleSize;
var heigtNum = heigt/circleSize;
var circles = [];
var count = 0;
var maxCount  = 15;

function defaultAlign(){
	for( var w =0;w < widthNum;w++){
		for( var h =0;h< heigtNum;h++){
			if( !circles[w]){
				circles[w] = new Array();
			}
			circle = new Path.Circle(new Point(w*circleSize,h*circleSize),circleSize/2-1);
			circle.strokeColor = '#fffc';
			circle.strokeWidth = 1;
			circles[w][h] = circle;
		}
	}
}

function setCircle(){
	for( var w =0;w < widthNum;w++){
		for( var h =0;h< heigtNum;h++){
			circles[w][h].fillColor = new HsbColor(w*360/widthNum*2,h*1/heigtNum,1);
			circles[w][h].visible = Math.floor(Math.random()+0.2) >= 1;
			circles[w][h].preVisible = circles[w][h].visible;
		}
	}
}

function onFrame( event ){
	if( circles.length <= 0 || --count > 0 ){
		return;
	}else {
		count = maxCount;
	}
	for( var w =0;w < widthNum;w++){
		for( var h =0;h< heigtNum;h++){
			var sum = 0;
			var hue = 0;
			var saturation = 0;
			for( var x = w-1; x<=w+1;x++){
				for( var y = h-1; y<=h+1;y++){
					if( w == x && h ==y ){
						continue;
					}
					if( circles[x] && circles[x][y] && circles[x][y].preVisible ){
						sum++;
						hue += circles[x][y].fillColor.hue;
						saturation += circles[x][y].fillColor.saturation;
					}
				}
			}
			if ( circles[w][h].preVisible ){
				if( 2 <= sum && sum < 4){
					circles[w][h].visible =true;
				} else {
					circles[w][h].visible = false;
				}
			} else {
				if( sum === 3){
					circles[w][h].visible =true;
					circles[w][h].fillColor = new HsbColor(hue/sum,saturation/sum,1);
				}
			}
			circles[w][h].preVisible = circles[w][h].visible;
		}
	}

}
function onMouseDown(){
	setCircle();
}

defaultAlign();
setCircle();


WEB+DB PRESS Vol.70

WEB+DB PRESS Vol.70

  • 作者: 成田一生,高津戸壮,Dr.Kein,近藤宇智朗,後藤秀宣,mala,中島聡,森田創,堤智代,A-Listers,はまちや2,佐藤裕介,久森達郎,大窪聡,本田謙,和田英一,天野祐介,藤吾郎(gfx),奥野幹也,WEB+DB PRESS編集部
  • 出版社/メーカー: 技術評論社
  • 発売日: 2012/08/24
  • メディア: 大型本
  • 購入: 7人 クリック: 83回
  • この商品を含むブログ (10件) を見る