引数として、中心点、半径、速度、カウントを渡して、回転位置の値を返す。
result.X:X座標 (整数)
result.Y:Y座標 (整数)
異なる設定で3色の点を回転させるサンプル。
HTML :
<div id="sample1">
<mark id="mark_blue"></mark>
<mark id="mark_red"></mark>
<mark id="mark_gold"></mark>
</div>
Javascript :
var count_blue=0;
var timer_blue;
function anirotation_blue() { //ブルーを動かす
clearTimeout(timer_blue);
//カウント時の位置を算出
var resultDic=$aniRotation(200,200,100,15,count_blue);
count_blue++;
//マークを移動:マークの半径分を調整
$id('mark_blue').style.left=resultDic.X-5+"px";
$id('mark_blue').style.top=resultDic.Y-5+"px";
//ループ
timer_blue=setTimeout(anirotation_blue,40);
}
var count_red=0;
var timer_red;
function anirotation_red() { //レッドを動かす
clearTimeout(timer_red);
//カウント時の位置を算出
var resultDic=$aniRotation(200,200,150,-30,count_red);
count_red++;
//マークを移動:マークの半径分を調整
$id('mark_red').style.left=resultDic.X-5+"px";
$id('mark_red').style.top=resultDic.Y-5+"px";
//ループ
timer_red=setTimeout(anirotation_red,40);
}
var count_gold=0;
var timer_gold;
var gold_radius=60;
var gold_vector=0.5;
function anirotation_gold() { //ゴールドを動かす
clearTimeout(timer_gold);
//少しずつ半径を拡大縮小する
if(gold_radius>60 && gold_radius<200) {
gold_radius+=gold_vector;
} else if(gold_radius==60) {
gold_vector=0.5;
gold_radius+=gold_vector;
} else if(gold_radius==200) {
gold_vector=-0.5;
gold_radius+=gold_vector;
}
//カウント時の位置を算出
var resultDic=$aniRotation(200,200,gold_radius,8,count_gold);
count_gold++;
//マークを移動:マークの半径分を調整
$id('mark_gold').style.left=resultDic.X-5+"px";
$id('mark_gold').style.top=resultDic.Y-5+"px";
//ループ
timer_gold=setTimeout(anirotation_gold,40);
}