球体の花火

また花火です。ちょっとアプローチを変えて、3Dに挑戦。角座標の使い方など。

花火、再び。

前回は、子供のお絵かきのような花火でしたが、今回は若干リアルです(・・か?)。
例のごとく、インスタンスをいっぱい生成しているので、遅いマシンの方は、気をつけて点火してください。

角座標

今日も簡単に。角座標を使って、3次元座標を2次元座標に変換する方法です。

適当なムービークリップシンボルに、以下のActionScriptクラスをリンクします(理屈はムシ)。


class Rotation3D extends MovieClip{
 var PI_half; //2分のパイ
 var x_center = 100;//中心
 var y_center = 100;//中心
 var radius = 80; //半径
 var angle1 = 0; //0-360度
 var angle2 = 0; //0-360度
 var speed1 = 0; //angle1の増分
 var speed2 = 0; //angle2の増分
 var z;

 function onLoad(){
  PI_half = Math.PI/180;
 }

 function onEnterFrame(){

  /*vvvvvvvvvvv 公式 vvvvvvvvvvvvvvvvv*/
  _x = radius
      * Math.cos( angle1*PI_half )
      * Math.cos( angle2*PI_half )
      + x_center;
  _y = radius
      * Math.cos( angle1*PI_half )
      * Math.sin( angle2*PI_half )
      + y_center;
  z = radius
      * Math.sin( angle1*PI_half );

  //「z」は、とりあえず計算だけしておく。
  //ここでは奥行きとして扱っているので、
  //_xscale,_yscaleを調整するために利用しています。

  _xscale = _yscale = 100*( (radius+z)/(radius*2) );

  angle1 += speed1;
  angle2 += speed2;
  if( angle1 > 360 ) angle1 -= 360;
  if( angle2 > 360 ) angle2 -= 360;
 }
}

で、プロパティを変えつつ、いろいろなパターンを生成してみると、


attachMovie('ball', 'tate' , 0 , {speed1:10, angle2:90} );
attachMovie('ball', 'yoko' , 1 , {speed1:10, angle2:0} );
attachMovie('ball', 'en' , 2 , {speed2:10, angle1:0} );
//attachMovie('ball', 'hatena' , 3 , {speed2:10, speed1:10, angle1:60} );


こうなります。3Dなんつっても、意外と簡単なモンですね。

冒頭の花火は、この2つの角度をずらしながら、たくさん並べて、半径(radius)をアニメーションにしただけです。ちょろっと出てくるヤナギは、前回のlineToを使って描画してます。


コメント

コメントしてください

closed.