跟著老師沒出數(shù)字點陣圖?
<body>
<canvas id="canvas" style="display:block;margin:50px auto;">
</canvas>
<script src="digit.js"></script>
<script src="countdown.js"></script>
</body>
//js部分
// JavaScript Document
var window_width=1024;
var window_height=768;
var radius=8;
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(0,0,parseInt(hours/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]==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();
}
}
2016-07-21
看我發(fā)的截圖。第30行,判斷條件里面數(shù)字的坐標(biāo)你沒寫對,這是個三維數(shù)組。
2018-03-02
var window_width=1024;
var window_height=768;
var radius=8;
window.onload=function(){
var canvas=document.getElementById("canvas");
var context=canvas.getContext("2d");
//方便屏幕大小和自適應(yīng)
canvas.width=window_width;
canvas.height=window_height;
render(context);
}
function render(cxt){
//繪制畫布
//繪制時鐘
//存放倒計時的數(shù)字
var hours=12;
var minutes=34;
var seconnds=56;
//繪制1個數(shù)字的所有信息 開始繪制的位置(x,y),要繪制的數(shù)字,(兩位數(shù)字),繪圖環(huán)境
renderDigit(50,50,parseInt(hours/10),cxt);
}
function renderDigit(x,y,num,cxt){
cxt.fillStyle="rgb(0,102,153)";
for(var i=0; i<digit[num].length; i++){
for(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();
}
}
}
}