// アナログ時計表示スクリプト // version 1.0 2006/12/17 // Copyright(c) 皆木 慎吾 // 下記の変数の値を書き換えることで動作を変更できます。 var XCELLS=50; // 左右セル数 あまり大きい値にすると速度が遅くなるので注意 var YCELLS=50; // 上下セル数 あまり大きい値にすると速度が遅くなるので注意 var XPIXEL=2; // セルあたりのピクセル数(横) var YPIXEL=2; // セルあたりのピクセル数(縦) var BACK_COLOR='#F0FFFF'; // 背景の色 var SCALE_COLOR='#000000'; // 目盛りの色 var HOUR_COLOR='#FF0000'; // 時針の色 var MINUTE_COLOR='#0000FF'; // 時針の色 var SECOND_COLOR='#00FF00'; // 時針の色 var PREV_HOUR=0; // 前回の時保存用 var PREV_MINUTE=0; // 前回の分保存用 var PREV_SECOND=0; // 前回の秒保存用 var TIMEOUT_ID; // タイマー用のID // 点を打つ function pset(x,y,c){ try{ document.getElementById('td'+x+'_'+y).style.background=c; }catch(e){ return null; } } // 線を引く function line(x1,y1,x2,y2,c){ xs=1; // ループカウンタの増分(横) ys=1; // ループカウンタの増分(縦) // 始点より終点が小さい(左・上)の時は増分の符号を反転 if(x1>x2) xs=-1; if(y1>y2) ys=-1; xy=(y2-y1)/(x2-x1); // xが1つ増えるたびにyがいくつ増えるか yx=(x2-x1)/(y2-y1); // yが1つ増えるたびにxがいくつ増えるか for(x=x1;x!=x2;x+=xs) pset(x,y1+Math.round((x-x1)*xy),c); for(y=y1;y!=y2;y+=ys) pset(x1+Math.round((y-y1)*yx),y,c); } // 針を描画する // d … 角度,lx … 長さ(横),ly …長さ(縦),c … 色 function putNeedle(d,lx,ly,c){ x=Math.sin(d * Math.PI/180); y=Math.cos(d * Math.PI/180); x=Math.round(x*lx); y=Math.round(y*ly); line(XCELLS/2,YCELLS/2,XCELLS/2+x,YCELLS/2-y,c); } // 目盛りを描画する function putScale(){ // DOMでセルを生成する tb=document.getElementById('tbody1'); for(y=0;y<=YCELLS;y++){ tr=document.createElement('tr'); for(x=0;x<=XCELLS;x++){ td=document.createElement('td'); td.id='td'+x+'_'+y; td.bgColor=BACK_COLOR; td.width=XPIXEL; td.height=YPIXEL; tr.appendChild(td); } tb.appendChild(tr); } // 30°ごとに点を打つ for(r=0;r<360;r+=30){ x=Math.cos(r * Math.PI/180); y=Math.sin(r * Math.PI/180); x=Math.round(x*XCELLS/2); y=Math.round(y*YCELLS/2); pset(x+XCELLS/2,y+YCELLS/2,SCALE_COLOR); } putTime(); } // 時刻を表示する function putTime(){ window.clearTimeout(TIMEOUT_ID); dt=new Date(); NOW_HOUR=dt.getHours(); NOW_MINUTE=dt.getMinutes(); NOW_SECOND=dt.getSeconds(); // 前回表示した針を消去する putNeedle(PREV_SECOND*6,XCELLS/2*9/10,YCELLS/2*9/10,BACK_COLOR); putNeedle(PREV_MINUTE*6,XCELLS/2*3/4,YCELLS/2*3/4,BACK_COLOR); putNeedle(PREV_HOUR*30+PREV_MINUTE/2,XCELLS/2*3/5,YCELLS/2*3/5,BACK_COLOR); // 針を描画する putNeedle(NOW_SECOND*6,XCELLS/2*9/10,YCELLS/2*9/10,SECOND_COLOR); putNeedle(NOW_MINUTE*6,XCELLS/2*3/4,YCELLS/2*3/4,MINUTE_COLOR); putNeedle(NOW_HOUR*30+NOW_MINUTE/2,XCELLS/2*3/5,YCELLS/2*3/5,HOUR_COLOR); // 時・分・秒を保存する PREV_HOUR=NOW_HOUR; PREV_MINUTE=NOW_MINUTE; PREV_SECOND=NOW_SECOND; // タイマー起動 TIMEOUT_ID=window.setTimeout('putTime()',500); } function stopClock(){ window.clearTimeout(TIMEOUT_ID); } // 描画用領域の作成 document.write('