为什么一模一样的代码,我自己敲一遍,就运行不出来相同的效果?
var WINDOW_WIDTH=1024;
var WINDOW_HEIGHT=768;
var WINDOW_TOP=60;
var WINDOW_LEFT=30;
var RADIUS=10;
window.onload = function () {
var canvas=document.getElementsById('canvas'); //调用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(WINDOW_LEFT,WINDOW_TOP,parseInt(hours/10),cxt); //将数拆开,一个数一个数的绘制
renderDigit(WINDOW_LEFT+15*(RADIUS+1),WINDOW_TOP,parseInt(hours%10),cxt);
renderDigit(WINDOW_LEFT+30*(RADIUS+1),WINDOW_TOP,10,cxt);
renderDigit(WINDOW_LEFT+39*(RADIUS+1),WINDOW_TOP,parseInt(minutes/10),cxt);
renderDigit(WINDOW_LEFT+54*(RADIUS+1),WINDOW_TOP,parseInt(minutes%10),cxt);
renderDigit(WINDOW_LEFT+69*(RADIUS+1),WINDOW_TOP,10,cxt);
renderDigit(WINDOW_LEFT+78*(RADIUS+1),WINDOW_TOP,parseInt(seconds/10),cxt);
renderDigit(WINDOW_LEFT+93*(RADIUS+1),WINDOW_TOP,parseInt(seconds%10),cxt);
}
function renderDigit(x,y,num,cxt){
cxt.fillStyle="rag(0,102,153)";
for(var i=0;i<digit[num].length;i++) //i代表行,j代表列,num代表数,.length代表方法
for(var j=0;j<digit[num][i].length;j++) //1是矩阵里的,代表绘制小球
{
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()
}
}
}
这有什么错误?为什么运行不了?
不是大神。。复制到本地f12马上就知道错误了。。第7行 document.getElementsById('canvas'); 应该是 document.getElementById('canvas');
学会调试~~