Question

因此，我正在使用JavaScript和库p5.js在HTML5中制作一个简单的目标训练游戏。当计时器被注释掉并且计时器在其他代码中起作用时，该代码起作用，但是当我将时间放入此代码中时，它不起作用。

let x;
let y;
let circle;
let dots = [];
let score = 0;
let gameover = false;

function setup() {
    createCanvas(1080, 800);
    xycircle();
}

function draw() {
    if (gameover) {
        gameend();
    } else {
        background(100, 100, 255);
        scorer();
        for (let dot of dots) {
            ellipse(dot.x, dot.y, dot.circle, dot.circle)
        }
    }
};

function xycircle() {
    for (i = 0; i < 25; i += 1) {
        dots.push({
            x: random(1080),
            y: random(100, 800),
            circle: random(25, 50)
        })
    };

};

function mousePressed() {

    var hit = false;
    for (let dot of dots) {
        if (dist(dot.x, dot.y, mouseX, mouseY) < dot.circle / 2) {
            dots = dots.filter(dot1 => dot1 !== dot)
            hit = true;
            if (dots.length === 0) {
                xycircle();
            }
        }
    };

    if (hit)
        score++
    else
        gameover = true;
};

function scorer() {
    fill(20, 75, 200);
    rect(0, 0, 1080, 75);
    fill(0, 0, 0);
    text(score, 950, 50)
    text(timeremaning, 900, 50)
    fill(255, 255, 255);
};

//function timer() {
//   let time = Date.now();
//   let timeremaning = 60000
//   if (timeremaning > time) {
//       timeremaning--
//   }
//   if (timeremaning === 0)
//       gameend()
//};

function gameend() {
    background(255, 0, 0);
    fill(0, 0, 0);
    text("GAME OVER", 540, 400);
    text("Your score was " + score, 540, 420);
};

我想要的只是一个1分钟或2分钟的计时器，它不会破坏我的代码。任何帮助表示赞赏。

Answer 1

您的timer函数似乎不太正确。我不确定您为什么将timeremaning（BTW的拼写错误）和now的值进行比较，这种方法对我来说没有意义。似乎您只想减少剩余时间，当您减少为零时，触发gameend()并将gameover设置为true。如果未设置gameover，则结束状态无法正确触发。

注意：您可能需要调整计时器的开始值，因为这需要一分钟以上的时间才能运行。

在不确切知道要拍摄什么的情况下，以下更改似乎在规定的时间后结束。

希望这会有所帮助。

let x;
let y;
let circle;
let dots = [];
let score = 0;
let gameover = false;
let timeremaning

function setup() {
    createCanvas(1080, 800);
    xycircle();
}

function draw() {
    if (gameover) {
        gameend();
    } else {
        background(100, 100, 255);
        scorer();
        for (let dot of dots) {
            ellipse(dot.x, dot.y, dot.circle, dot.circle)
        }
    }
};

function xycircle() {
    for (i = 0; i < 25; i += 1) {
        dots.push({
            x: random(1080),
            y: random(100, 800),
            circle: random(25, 50)
        })
    };

};

function mousePressed() {

    var hit = false;
    for (let dot of dots) {
        if (dist(dot.x, dot.y, mouseX, mouseY) < dot.circle / 2) {
            dots = dots.filter(dot1 => dot1 !== dot)
            hit = true;
            if (dots.length === 0) {
                xycircle();
            }
        }
    };

    if (hit)
        score++
    else
        gameover = true;
};

function scorer() {
    fill(20, 75, 200);
    rect(0, 0, 1080, 75);
    fill(0, 0, 0);
    text(score, 950, 50)
    text(timeremaning, 900, 50)
    fill(255, 255, 255);
};

function timer() {
  let time = Date.now();
   timeremaning = 60000
   setInterval(() => {
      timeremaning--
      if (timeremaning <= 0) { gameend(); gameover = true }
   }, 1)
};

function gameend() {
    background(255, 0, 0);
    fill(0, 0, 0);
    text("GAME OVER", 540, 400);
    text("Your score was " + score, 540, 420);
};
timer()

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.2/p5.min.js"></script>

当我添加计时器功能时，它不会画出我的“圆点”

1 个答案: