hatenaブログでpaper.jsのテスト4

　以前のがうまく行かなかったので作業的に少し手前に戻って、多数のpath表示テスト。
クリックでcanvas領域の中心を元にして円増加。クリックするほど、一度に増える数が多くなる。

以下ソース

var paths_4 = new Array();
var added_4 = 1;

function addCircles(  ){
	var num = added_4;
	for(var i= 0;i<num;i++){
		var circle  = new Path.Circle(new Point(150+20*Math.sin(Math.PI*2*i/num)*(added_4-1),75+20*Math.cos(Math.PI*2*i/num)*(added_4-1)),30);
		circle.strokeColor = '#fff';
		circle.fillColor = new HsbColor(200,0.8,1,0.6);
		circle.strokeWidth = 4;
		circle.prescale =1;
		paths_4.push(circle);
	}
	added_4++;
}
addCircles(  );

function onFrame( event ){
	for(var i= 0;i<paths_4.length;i++){
		var sinValue  = Math.sin((event.count+i)/8);
		if(sinValue <= -0.95){
			paths_4[i].fillColor = new HsbColor(event.count+i*10,0.8,1,0.5);
		}
		var scale = ( sinValue+1.3)/2;
		paths_4[i].scale(scale/paths_4[i].prescale);
		paths_4[i].prescale = scale;
	}
}
function onMouseDown( event ){
	addCircles();
}

いくらでも描画量が増える割に、表示領域が増えるわけでもないので、増やしすぎると見えないところでマシンパワーを食う。

増やしていくとこのような感じになる。

　作りながら思い描いていたものとなんだか違う。クリック毎に円が増えるけれど、頂点が揃いがちなので、なんだか微妙に見える気がする。

　詰まった点として、テスト環境でセミコロンつけ忘れていると、ブログに貼り付ける段階で改行やタブを削除するため、ブログで表示できなかった。なかなか気づきにくい。
　また以前のテストの結果を見ると、ブログん全体を表示したときに互いに干渉していた様子があったので名前をユニークになるようにした。したのはいいのだがあまりカッコつかないので、viewごとの変数のスコープについてそのうち調べる。