从更改数组中获取静态值

Question

我正在用 P5.js 和常规 javascript 创建游戏。我有坠落的物体（在一个数组中），当与鼠标碰撞时，return 到屏幕顶部。

我想在碰撞的位置加一个分号。我如何存储该对象的最后一个已知坐标，让得分数字在那里停留一段时间？

现场原型可以在这里看到：http://www.getelonto.space（按任意键开始游戏）

我搜索了整个互联网，但一无所获。

//The array in the setup

function setup() {
  for (var i = 0; i < numberOfMeteors; i++) {
    meteors[i] = {
      x: random(windowWidth-100),
      y: -1* random(windowHeight),

      display: function(){
        image(meteorimg, this.x, this.y);
    },
      fall: function(){
        this.y += random(1,15);
      }
    }   
  }
}

//The array in the draw

function meteor() {
  for (var i = 0; i < numberOfMeteors; i++) {
      meteors[i].display();
      meteors[i].fall();

    //Mouse collision
    if (meteors[i].x < (mouseX+100) && meteors[i].x > (mouseX-175) && 
        meteors[i].y > (750) && meteors[i].y < (850)||
       (meteors[i].x < (mouseX+50) && meteors[i].x > (mouseX-100) && 
        meteors[i].y > (630) && meteors[i].y <= (750))) {

      // Attempt at getting the coordinates at collision
      var minScoreIndicatorX = meteors[i].x;
      var minScoreIndicatorY = meteors[i].y;


      //This is the score text I want to show
      text("-3", minScoreIndicatorX, minScoreIndicatorY);

      // Actions when collided
      score-=3;
      Lives = Lives-1;
      meteors[i].y = -1* (random(300));
      meteors[i].x = (random(windowWidth)-100);
      bgY2-=10;
      if (start==false) {
        meteors[i].y = 0;
      }
    }

    // Meteors returning to the top without collision
    if (meteors[i].y>windowHeight) {
      meteors[i].y = -1* (random(600));
      meteors[i].x = (random(windowWidth)-100);
    }
  }
}

当我现在运行它时，文本会显示一个框架，然后到顶部与它链接的流星。

Answer 1

就像我在评论中解释的那样，解决方案是创建另一个全局变量 scores 并在碰撞时添加一个条目并安排删除它。在绘制阶段，只渲染分数数组中的任何文本。

我用完整的 javascript 代码 here

制作了一个 fiddle

我检查了该代码，发现第 35 行有一个小错字。它的 var scoreTTL = 3000; 应该是 var scoresTTL = 3000;（注意缺少的 "s"）（已更新 fiddle 以反映它）

如果您对代码或其背后的逻辑有任何疑问，我很乐意以更详细的方式进行解释。

希望对您有所帮助！

编辑：超时丢失了一些代码（第 223 行）已更改 fiddle link

从更改数组中获取静态值

Get static value from changing Array

javascript

arrays

p5.js