问答详情
源自：3-2 倒计时数字钟的具体绘制

为什么我到他显示出1的时候我的显示不出来

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(10,10,parseInt( hours/10 ),context);
}

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()
            }
}


提问者：慕姐4007966 2017-09-24 16:41

个回答

  • qq_无根草_0
    2017-11-10 11:51:27

    第一个错误：少了一个*

    renderDigit(MARGIN_LEFT+15(RADIUS+1),MARGIN_TOP,parseInt(hours%10),cxt);

    renderDigit(MARGIN_LEFT+15*(RADIUS+1),MARGIN_TOP,parseInt(hours%10),cxt);

    第二个错误：少了一个大括号

    for(var j=0;j<digit[num][i].length;j++)

    for(var j=0;j<digit[num][i].length;j++){

    0
  • 慕仰9528121
    2017-10-08 13:23:30

     哪里有错吗？为什么浏览器中什么都不显示？
    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()
            }
    }

    0
  • 慕姐4007966
    2017-09-24 16:53:49

    我代码看了好久 没发现错误，然后我去改了我HTML中的本来我的设置是这样的

    <canvas id="canvas" style="border: 1px soild blue;display:block; margin: 0 auto;"></canvas>

    开始我不行的时候 可是会出现canvas 的绘图框 ，然后我删了canvas 下面的 style 就会显示数字 1 了，然后我再添加 style 就可以了 ，这个是什么原因

    0