如何才能看到画布日志?

时间:2017-12-25 01:14:02

标签: javascript node.js canvas

我正在开发agario。我想要在游戏中进行倒计时,但在画布中看不到倒计时。

function drawGameScene() {
        if (!lastCalledTime) {
            lastCalledTime = Date.now();
            fps = 60;
            displayfps = fps;
        } else {
            delta = (Date.now() - lastCalledTime) / 1000;
            lastCalledTime = Date.now();
            fps = 1 / delta;
        }
        var a, oldtime = Date.now();
        ++cb;
        timestamp = oldtime;
        if (0 < playerCells.length) {
            calcViewZoom();
            var c = a = 0;
            for (var d = 0; d < playerCells.length; d++) {
                playerCells[d].updatePos();
                a += playerCells[d].x / playerCells.length;
                c += playerCells[d].y / playerCells.length;
            }
            posX = a;
            posY = c;
            posSize = viewZoom;
            nodeX = (nodeX + a) / 2;
            nodeY = (nodeY + c) / 2
        } else {
            nodeX = (29 * nodeX + posX) / 30;
            nodeY = (29 * nodeY + posY) / 30;
            viewZoom = (9 * viewZoom + posSize * viewRange()) / 10;
        }
        buildQTree();
        mouseCoordinateChange();
        xa || ctx.clearRect(0, 0, canvasWidth, canvasHeight);
        if (xa) {
            if (showDarkTheme) {
                ctx.fillStyle = '#111111';
                ctx.globalAlpha = .05;
                ctx.fillRect(0, 0, canvasWidth, canvasHeight);
                ctx.globalAlpha = 1;
            } 
            else if (pembetema) {
                ctx.fillStyle = '#ff4081';
                ctx.globalAlpha = .05;
                ctx.fillRect(0, 0, canvasWidth, canvasHeight);
                ctx.globalAlpha = 1;
            }else if (yesiltema) {
                ctx.fillStyle = '#40ff58';
                ctx.globalAlpha = .05;
                ctx.fillRect(0, 0, canvasWidth, canvasHeight);
                ctx.globalAlpha = 1;
            }else if (default_tema) {
                ctx.fillStyle = '#F2FBFF';
                ctx.globalAlpha = .05;
                ctx.fillRect(0, 0, canvasWidth, canvasHeight);
                ctx.globalAlpha = 1;
            } 
        } else {
            drawGrid();
        }
        nodelist.sort(function (a, b) {
            return a.size == b.size ? a.id - b.id : a.size - b.size
        });
        ctx.save();
        ctx.translate(canvasWidth / 2, canvasHeight / 2);
        ctx.scale(viewZoom, viewZoom);
        ctx.translate(-nodeX, -nodeY);
        if (transparentRender == true) {
            ctx.globalAlpha = 0.6;
        } else {
            ctx.globalAlpha = 1;
        }

    /*drawBorders(ctx);*/

    for (d = 0; d < Cells.length; d++) Cells[d].drawOneCell(ctx);

        for (d = 0; d < nodelist.length; d++) nodelist[d].drawOneCell(ctx);
        //console.log(Cells.length);
        if (drawLine) {
            drawLineX = (3 * drawLineX + lineX) /
                4;
            drawLineY = (3 * drawLineY + lineY) / 4;
            ctx.save();
            ctx.strokeStyle = "#FFAAAA";
            ctx.lineWidth = 10;
            ctx.lineCap = "round";
            ctx.lineJoin = "round";
            ctx.globalAlpha = .5;
            ctx.beginPath();
            for (d = 0; d < playerCells.length; d++) {
                ctx.moveTo(playerCells[d].x, playerCells[d].y);
                ctx.lineTo(drawLineX, drawLineY);
            }
            ctx.stroke();
            ctx.restore()

        }
                // border -->
        ctx.strokeStyle = '#00D1DF';
        ctx.lineWidth = 25;
        ctx.lineCap = "round";
        ctx.lineJoin = "round";
        ctx.beginPath();
        ctx.moveTo(leftPos,topPos);
        ctx.lineTo(rightPos,topPos);
        ctx.lineTo(rightPos,bottomPos);
        ctx.lineTo(leftPos,bottomPos);
        ctx.closePath();
        ctx.stroke();
        // <--
        ctx.restore();

///////////////////////////////////////// MY COUNTDOWN CODES ////////////////////////////////////////////////

        ctx.globalAlpha = 1;
        ctx.fillStyle = "#0000FF";
        ctx.font = "30px Roboto";
        if(this.countdown < 3600){
        var countDownStr = "";
        var min = Math.floor(this.countdown/60);
        if ( min < 10 ){
            countDownStr += "0";
        }
        countDownStr += min+":";

        var sec = this.countdown%60;
        if ( sec<10 ){
            countDownStr += "0";
        }
        countDownStr += sec;
        ctx.fillText(countDownStr, ((canvasWidth - ctx.measureText(countDownStr).width) * 0.5), 30);
        }

///////////////////////////////////////// MY COUNTDOWN CODES ////////////////////////////////////////////////


        lbCanvas && lbCanvas.width && ctx.drawImage(lbCanvas, canvasWidth - lbCanvas.width - 10, 10); // draw Leader Board

        if (!hideChat)
        {
            if ((chatCanvas != null)&&(chatCanvas.width > 0)) ctx.drawImage(chatCanvas, 0, canvasHeight - chatCanvas.height - 50); // draw Chat Board
        }
        var mass = calcUserScore();
        userScore = Math.max(userScore, mass);
        if (0 != userScore) {
            kb();
             if (null == scoreText) {
                scoreText = new UText(24, '#FFFFFF');
            }
            var boxOpacity = .25;
            scoreText.setValue("Score: " + ~~(userScore / 100));
            c = scoreText.render();
            w = c.width;
            ctx.globalAlpha = boxOpacity;
            ctx.fillStyle = "#000000";
            ctx.fillRect(10, 10, w + 10, 34);
            ctx.globalAlpha = 1;
            ctx.drawImage(c, 15, 15);
            scoreText.setValue("Mass: " + ~~(mass / 100));
            c = scoreText.render();
            w = c.width;
            ctx.fillStyle = "rgba(0,0,0, " + boxOpacity;
            ctx.fillRect(10, 50, w + 10, 34);
            ctx.drawImage(c, 15, 55);
        }
        drawSplitIcon(ctx);
        drawTouch(ctx);
         drawMap();
        var deltatime = Date.now() - oldtime;
        deltatime > 1E3 / 60 ? z -= .01 : deltatime < 1E3 / 65 && (z += .01);
        .4 > z && (z = .4);
        1 < z && (z = 1)
    }

我在倒计时的位置添加了注释行。问题出在哪儿 ?我快疯了。我在倒计时的位置添加了注释行。问题出在哪儿 ?我快疯了。我需要添加“ctx.save()”或“ctx.restore()”代码?我需要做什么?

0 个答案:

没有答案