digit[num] is undefined
html文件
<!DOCTYPE html>
<html>
<head>
??? <meta http-equiv="Context-Type" content="text/html;charset=utf-8">
?? ?<title></title>
</head>
<body>
<canvas id="canvas" style="display: block;margin: 50px auto;">
?? ?當前瀏覽器不支持Canvas，請更換瀏覽器再試
</canvas>
<script type="text/javascript" src="digit.js"></script>
<script type="text/javascript" src="countdown.js"></script>
</body>
</html>
digit.js文件
var digit =
[
?? [
????? [0,0,1,1,1,0,0],
????? [0,1,1,0,1,1,0],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [0,1,1,0,1,1,0],
????? [0,0,1,1,1,0,0]
?? ],//0
?? [
????? [0,0,0,1,1,0,0],
????? [0,1,1,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [1,1,1,1,1,1,1]
?? ],//1
?? [
????? [1,1,1,1,1,1,1],
????? [0,0,0,0,0,1,1],
????? [0,0,0,0,1,1,0],
????? [0,0,0,1,1,0,0],
????? [0,0,1,1,1,0,0],
????? [0,0,0,0,1,1,0],
????? [0,0,0,0,0,1,1],
????? [0,0,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [0,1,1,1,1,1,0]
?? ],//3
?? [
????? [0,0,0,0,1,1,0],
????? [0,0,0,1,1,1,0],
????? [0,0,1,1,1,1,0],
????? [0,1,1,0,1,1,0],
????? [1,1,0,0,1,1,0],
????? [1,1,1,1,1,1,1],
????? [0,0,0,0,1,1,0],
????? [0,0,0,0,1,1,0],
????? [0,0,0,0,1,1,0],
????? [0,0,0,1,1,1,1]
?? ],//4
?? [
????? [1,1,1,1,1,1,1],
????? [1,1,0,0,0,0,0],
????? [1,1,0,0,0,0,0],
????? [1,1,1,1,1,1,0],
????? [0,0,0,0,0,1,1],
????? [0,0,0,0,0,1,1],
????? [0,0,0,0,0,1,1],
????? [0,0,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [0,1,1,1,1,1,0]
?? ],//5
?? [
????? [0,0,0,0,1,1,0],
????? [0,0,1,1,0,0,0],
????? [0,1,1,0,0,0,0],
????? [1,1,0,0,0,0,0],
????? [1,1,0,1,1,1,0],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [1,1,0,0,0,1,1],
????? [0,1,1,1,1,1,0]
?? ],//6
?? [
????? [1,1,1,1,1,1,1],
????? [1,1,0,0,0,1,1],
????? [0,0,0,0,1,1,0],
????? [0,0,0,0,1,1,0],
????? [0,0,0,1,1,0,0],
????? [0,0,0,1,1,0,0],
????? [0,0,1,1,0,0,0],
????? [0,0,1,1,0,0,0],
????? [0,0,1,1,0,0,0],
????? [0,0,1,1,0,0,0]
?? ],//7
?? [
?????? [0,1,1,1,1,1,0],
?????? [1,1,0,0,0,1,1],
?????? [1,1,0,0,0,1,1],
?????? [1,1,0,0,0,1,1],
?????? [0,1,1,1,1,1,0],
?????? [1,1,0,0,0,1,1],
?????? [1,1,0,0,0,1,1],
?????? [1,1,0,0,0,1,1],
?????? [1,1,0,0,0,1,1],
?????? [0,1,1,1,1,1,0]
?? ],//8
?? [
?????? [0,1,1,1,1,1,0],
?????? [1,1,0,0,0,1,1],
?????? [1,1,0,0,0,1,1],
?????? [1,1,0,0,0,1,1],
?????? [0,1,1,1,0,1,1],
?????? [0,0,0,0,0,1,1],
?????? [0,0,0,0,0,1,1],
?????? [0,0,0,0,1,1,0],
?????? [0,0,0,1,1,0,0],
?????? [0,1,1,0,0,0,0]
?? ],//9
?? [
?????? [0,0,0,0],
?????? [0,0,0,0],
?????? [0,1,1,0],
?????? [0,1,1,0],
?????? [0,0,0,0],
?????? [0,0,0,0],
?????? [0,1,1,0],
?????? [0,1,1,0],
?????? [0,0,0,0],
?????? [0,0,0,0],
?? ]
];
countdown.js文件
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();
?? ??? ??? ?}
?? ??? ?}
?? ?}
}
瀏覽器老是說digit[num] is undefined 而且12顯示為13，很無奈，不知道哪里錯了，請大神們指點一二。
2017-04-11
copy不仔細，還是自己寫的更不仔細。 digit數組少了一個。所以digit[10].length找不到