var WINDOW_WIDTH = 600, WINDOW_HEIGHT = 300; var RADIUS = 4, DISTANCE = 1; var hour=0,minute=0,second=0; window.onload = function(){ var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); canvas.width = WINDOW_WIDTH; canvas.height = WINDOW_HEIGHT; setInterval(drawTime(context),500); //drawTime(context); } function checkTime(i){ if(i<10){ i = '0'+i; } return i; } function drawTime(cnt){ //var timer = setInterval(function(){ var now = new Date(); hour = now.getHours(), minute = now.getMinutes(), second = now.getSeconds(); hour = checkTime(hour); minute = checkTime(minute); second = checkTime(second); var h1 = parseInt(hour/10), h2 = hour%10, m1 = parseInt(minute/10), m2 = minute%10, s1 = parseInt(second/10), s2 = second%10; var digitWidth = Math.floor(WINDOW_WIDTH/8), markWidth = parseInt(digitWidth/7*4); cnt.clearRect(0,0,WINDOW_WIDTH,WINDOW_HEIGHT);//保证每次数字刷新,canvas都跟着刷新 drawDigit(h1,0,cnt); drawDigit(h2,digitWidth,cnt); drawDigit(10,2*digitWidth,cnt); drawDigit(m1,digitWidth*2+markWidth,cnt); drawDigit(m2,digitWidth*3+markWidth,cnt); drawDigit(10,digitWidth*4+markWidth,cnt); drawDigit(s1,digitWidth*4+markWidth*2,cnt); drawDigit(s2,digitWidth*5+markWidth*2,cnt); // },500); } function drawDigit(num,dr,cnt){ for(var i = 0; i<digit[num].length;i++){ for(var j = 0; j<digit[num][i].length;j++){ var rx = (2*j+1)*(RADIUS + DISTANCE)+dr, ry = (2*i+1)*(RADIUS + DISTANCE); if (digit[num][i][j] == 1){ cnt.beginPath(); cnt.arc(rx,ry,RADIUS,0,2*Math.PI); cnt.closePath(); cnt.fillStyle = '#03356f'; cnt.fill();} }//点阵数组中的每一排 }//取到digit数组中第h1个点阵数组 }
setInterval(
function(){
render(context);
},
1000
);
这样就ok了
之前学setInterval是说可以setInterval(render,1000);或者setInterval("render(context)",1000);
但是这里不行,感觉是因为render这个函数有参数的原因