Spawning multiply objects on canvas (same as everyone else)

[emilybarwinczak]

What's the problem you're trying to solve?

trying to spawn multiple objects on the canvas

Post any code you think might be relevant (one fenced block per file)

function cats() {
    this.x = Math.random() * (game.width - (game.width - game.width)) + (game.width - game.width);
    this.y = 0;
    this.vx = -0.5;
    this.vy = 1;
    this.radius = 5;
    this.color = 'blue';
    this.gravity = 1;
    this.gravitySpeed = 0;
    this.bounce = 1;
    this.ctx = game.getContext('2d');
    this.draw = function() {
      this.ctx.beginPath();
      this.ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
      this.ctx.closePath();
      this.ctx.fillStyle = this.color;
      this.ctx.fill();
    }
    this.newPos = function() {
      this.gravitySpeed += this.gravity;
      this.x += this.vx;
      this.y += this.vy + this.gravitySpeed;
      this.hitBottom();
    }
    this.hitBottom = function() {
      var rockbottom = game.height - this.radius;
      if (this.y > rockbottom) {
        this.y = rockbottom;
        this.gravitySpeed = -(this.gravitySpeed / 1.5 * this.bounce);
      }
    }
  }

  var ball = new cats();

  function drawf() {
    // ball.ctx.clearRect(0, 0, game.width, game.height);
    ball.draw();
    ball.newPos();
    raf = window.requestAnimationFrame(drawf);
  }

  game.addEventListener('mouseover', function(e) {
    raf = window.requestAnimationFrame(drawf);
  });

  ball.draw();

If you see an error message, post it here. If you don't, what unexpected behavior are you seeing?

no error -- found a site online that helped explain (part of) this. I'm also not totally sure about all the values/elements in the code block

What is your best guess as to the source of the problem?

assuming I need to add some sort of array or for loop but not sure where or how

What things have you already tried to solve the problem?

adding a for loop

[Lizzwest]

http://www.java2s.com/example/javascript/canvas/randomly-spawn-one-by-one-object-in-canvas.html

Here is an article you may want to check out in regards to random generation in Canvas. I also see that you said you already tried adding a for loop, where/how did you implement it and what wasn't working?