var?WINDOW_WIDTH=1024
var?WINDOW_HEIGHT=768
var?RADIUS=8
var?MARGIN_TOP=60
var?MARGIN_LEFT=30
window.onload=function()?{
????var?canvas?=?document.getElementById('canvas');
????var?context?=?canvas.getContext("2d");
????canvas.width?=?WINDOW_WIDTH;
????canvas.height?=?WINDOW_HEIGHT;
????render(?context?)
}
function??render(cxt)?{
????var?hours=12
????var?minutes=34
????var?seconds=56
renderDigit(MARGIN_LEFT,MARGIN_TOP,parseInt(hours/10),cxt}
renderDigit(MARGIN_LEFT,MARGIN_TOP,parseInt(hours/10),cxt);
renderDigit(MARGIN_LEFT+15*(RADIUS+1),MARGIN_TOP,parseInt(hours%10),cxt);
renderDigit(MARGIN_LEFT+30*(RADIUS+1),MARGIN_TOP,10,cxt);
renderDigit(?MARGIN_LEFT?+?39*(RADIUS+1)?,?MARGIN_TOP?,?parseInt(minutes/10)?,?cxt);
renderDigit(?MARGIN_LEFT?+?54*(RADIUS+1)?,?MARGIN_TOP?,?parseInt(minutes%10)?,?cxt);
renderDigit(?MARGIN_LEFT?+?69*(RADIUS+1)?,?MARGIN_TOP?,?10?,?cxt);
renderDigit(?MARGIN_LEFT?+?78*(RADIUS+1)?,?MARGIN_TOP?,?parseInt(seconds/10)?,?cxt);
renderDigit(?MARGIN_LEFT?+?93*(RADIUS+1)?,?MARGIN_TOP?,?parseInt(seconds%10)?,?cxt);
}
function?rendeiDigitf(?x,?y,?num,?cxt?)
{
????cxt.fillStyle="rgb(0,102,153)";
????for(var?i=0;i<digit[num].length;i++)
????????for(var?j=0;j<digit[num][i].length;j++){
????????????if(digit[num][i][j]==1)?{
????????????????cxt.beginPath();
????????????????cxt.arc(x?+?j?*?2?*?(RADIUS?+?1)?+?(RADIUS?+?1),?y?+?i?*?2?*?(RADIUS?+?1)?+?(RADIUS?+?1),RADIUS,0,2?*?Math.PI
????????????)
????????????????cxt.closePath()
????????????????cxt.fill()
????????????}
????????????}
}
2019-09-20
很多語句未加" ; "符號
花括號圓括號寫錯
renderDigit(MARGIN_LEFT,?MARGIN_TOP,?parseInt(hours?/?10),?cxt);多寫
var?WINDOW_WIDTH?=?1024;
var?WINDOW_HEIGHT?=?768;
var?RADIUS?=?8;
var?MARGIN_TOP?=?60;
var?MARGIN_LEFT?=?30;
window.onload?=?function?()?{
????var?canvas?=?document.getElementById('canvas');
????var?context?=?canvas.getContext("2d");
????canvas.width?=?WINDOW_WIDTH;
????canvas.height?=?WINDOW_HEIGHT;
????render(context);
}
function?render(cxt)?{
????var?hours?=?12;
????var?minutes?=?34;
????var?seconds?=?56;
????renderDigit(MARGIN_LEFT,?MARGIN_TOP,?parseInt(hours?/?10),?cxt);
????renderDigit(MARGIN_LEFT?+?15?*?(RADIUS?+?1),?MARGIN_TOP,?parseInt(hours?%?10),?cxt);
????renderDigit(MARGIN_LEFT?+?30?*?(RADIUS?+?1),?MARGIN_TOP,?10,?cxt);
????renderDigit(MARGIN_LEFT?+?39?*?(RADIUS?+?1),?MARGIN_TOP,?parseInt(minutes?/?10),?cxt);
????renderDigit(MARGIN_LEFT?+?54?*?(RADIUS?+?1),?MARGIN_TOP,?parseInt(minutes?%?10),?cxt);
????renderDigit(MARGIN_LEFT?+?69?*?(RADIUS?+?1),?MARGIN_TOP,?10,?cxt);
????renderDigit(MARGIN_LEFT?+?78?*?(RADIUS?+?1),?MARGIN_TOP,?parseInt(seconds?/?10),?cxt);
????renderDigit(MARGIN_LEFT?+?93?*?(RADIUS?+?1),?MARGIN_TOP,?parseInt(seconds?%?10),?cxt);
}
function?renderDigit(x,?y,?num,?cxt)?{
????cxt.fillStyle?=?"rgb(0,102,153)";
????for?(var?i?=?0;?i?<?digit[num].length;?i++)
????????for?(var?j?=?0;?j?<?digit[num][i].length;?j++)?{
????????????if?(digit[num][i][j]?==?1)?{
????????????????cxt.beginPath();
????????????????cxt.arc(x?+?j?*?2?*?(RADIUS?+?1)?+?(RADIUS?+?1),?y?+?i?*?2?*?(RADIUS?+?1)?+?(RADIUS?+?1),?RADIUS,?0,?2?*?Math.PI);
????????????????cxt.closePath();
????????????????cxt.fill();
????????????}
????????}
}