大魔王阳哥
2019-09-06 08:56
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() } } }
很多语句未加" ; "符号
花括号圆括号写错
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();
}
}
}
炫丽的倒计时效果Canvas绘图与动画基础
96746 学习 · 1000 问题
相似问题