| INDEX |

Flashの曲線を描く関数curveToは、2次ベジェ曲線だ、とマニュアルに書いてあったのだけど、このスクリプトで描く線を、モーションガイドのように使いたいなぁ、と思った次第です。
ベジェ曲線の式は、リンク先の通りなので、とりあえずここから。


とりあえず、普通に描いた曲線の上を移動してみます。
ぴったり座標が合いますね。当たり前なんでしょうけど。数式って気持ちよいです。

//座標を取得するのはこんな感じ
private function getPosOnBezje2D( x0:Number,y0:Number,x1:Number,y1:Number,cx:Number,cy:Number,t:Number ):Point{
  var tp:Number = 1.0 - t;
  return new Point( x0*tp*tp + 2*cx*t*tp + x1*t*t , y0*tp*tp + 2*cy*t*tp + y1*t*t );
}

次は曲線の傾きに合わせてみます。

地味ですねぇ。上の式を微分すると⊿xと⊿yが得られるので、それを回転にあてています。

private function getDeffOnBezje2D( x0:Number,y0:Number,x1:Number,y1:Number,cx:Number,cy:Number,t:Number ):Number{
  var dx:Number = 2 * ( t * ( x0 + x1 - 2 * cx ) - x0 + cx );
  var dy:Number = 2 * ( t * ( y0 + y1 - 2 * cy ) - y0 + cy );
  return Math.atan2( dy , dx );
}

よく眺めると、速度が一定でないですね…。次はそこに手を入れようかと。地味ですが。

>> source

コメントは受け付けていません。

| INDEX |