AfterEffectsで時間をカウントアップするスクリプト(エクスプレッション)

指定した期間で、指定した範囲で、時刻をカウントアップするスクリプト(エクスプレッション)の紹介です。

例えば、タイムラインの10秒〜60秒にかけて、2000年4月1日から2010年4月1日までの年月日をカウントアップするようにしたい、なんていう場合に使えます。
もちろん指定範囲を変えれば、1分の動画で「7時間を時分秒単位でカウントアップ」なんて事も可能です。

下記の動画の中央下部に表示している年月日のような感じです。(動画は2分目辺りから見て下さい)


それでは、上記の「タイムラインの10秒〜60秒にかけて、2000年4月1日から2010年4月1日までの年月日をカウントアップする」という例で実際にやってみます。

「年」「月」「日」を別々のテキストとして作成します。
まずは「年」から。


まずは、コンポジション内にテキストを適当に貼り付けて下さい。
そうしたら、そのテキストの「ソーステキスト」プロパティにエクスプレッションを追加します。(メニューバーから「アニメーション」「エクスプレッションを追加」するか、ショートカット「Alt+Shift+^」を押します)

下記のような感じになってるはず。


エクスプレッションに下記のスクリプトを記述します。
var ps = 10;	//開始フレーム(秒)
var pe = 60;	//終了フレーム(秒)
var cstd = new Date(2000,3,1,0,0,0,0);	//開始日(年,月,日,時,分,秒,ミリ秒)
var cedd = new Date(2010,3,1,0,0,0,0);	//終了日

var tm = (cedd.getTime() - cstd.getTime()) / (pe-ps) * (time-ps);
var cd = new Date(cstd.getTime() + tm);

if(time<ps)
	cstd.getFullYear();
else if(time>=pe)
	cedd.getFullYear();
else
	cd.getFullYear();


これで「年」をカウントアップする事ができるようになります。

ここで注意してほしいのが、開始日と終了日の指定をしている部分(new Dateしている部分)です。

この例だと「4月」を指定したいのに、スクリプトでは「3」を指定しています。
月の指定だけはゼロオリジン(0から始まる)だからです。なので指定したい月から1を引いた値を指定します。

プログラマには常識ではありますが、まあ動画だけ作りたい人には馴染みが薄いかもしれないので念の為。
おそらく英語圏では月は数値じゃなくて名称を使うという習慣が絡んで、こんな変な事になっているんじゃないかと。



さて、「年」ができました。あとは同じようなやり方で「月」を作ります。
スクリプトは下記のようになります。
var ps = 10;	//開始フレーム(秒)
var pe = 60;	//終了フレーム(秒)
var cstd = new Date(2000,3,1,0,0,0,0);	//開始日(年,月,日,時,分,秒,ミリ秒)
var cedd = new Date(2010,3,1,0,0,0,0);	//終了日

var tm = (cedd.getTime() - cstd.getTime()) / (pe-ps) * (time-ps);
var cd = new Date(cstd.getTime() + tm);

if(time<ps)
	cstd.getMonth()+1;
else if(time>=pe)
	cedd.getMonth()+1;
else
	cd.getMonth()+1;

変更点は「〜.getFullYear()」の部分が「〜.getMonth()+1」になった所だけです。
先程も書いたように、「月」はゼロオリジン(0から始まる)なので、今度は1を足しています。
入力(開始、終了の指定)の時は1を引く、出力の(値を表示する)場合は1を足す、というものだと覚えて下さい。
ちょっと煩わしいですが……。


で、あとは「日」の指定ですが、これも同様にやります。

var ps = 10;	//開始フレーム(秒)
var pe = 60;	//終了フレーム(秒)
var cstd = new Date(2000,3,1,0,0,0,0);	//開始日(年,月,日,時,分,秒,ミリ秒)
var cedd = new Date(2010,3,1,0,0,0,0);	//終了日

var tm = (cedd.getTime() - cstd.getTime()) / (pe-ps) * (time-ps);
var cd = new Date(cstd.getTime() + tm);

if(time<ps)
	cstd.getDate();
else if(time>=pe)
	cedd.getDate();
else
	cd.getDate();

変更点は「〜.getFullYear()」の部分が「〜.getDate()」になるだけです。

あとはおわかりかと思いますが、「〜.getFullYear()」の部分を変えるだけで「時」「分」「秒」「ミリ秒」も同様に表示させる事が可能です。


曜日:getDay(0が日曜日、1が月曜日……6が土曜日)
時:getHours
分:getMinutes
秒:getSeconds
ミリ秒:getMilliseconds



後は自分の目的に合わせていじってみてください。