Cannot read properties of undefined (reading 'copy')

p5.js Coding Questions
1

Hi,

I am working on a sketch with rectangles and circles slowly falling to the bottom of the screen at random angles, colliding with each other and the ground and walls.

https://editor.p5js.org/bdooley7/sketches/RBeFV18PQ

While the circles would stop at the wall and ground boundaries, the rectangle would fall through a little bit, stopping at their center point. While I was trying to fix this, I began to receive this message:

TypeError: Cannot read properties of undefined (reading ‘copy’)
at undefined:88974:25

Still, I am having trouble handling collisions between circle-circles, rectangle-rectangles, and rectangle-circles and would greatly appreciate any help!

2

This is the full exception messages:

p5.js:88974 Uncaught TypeError: Cannot read properties of undefined (reading 'copy')
    at Function.sub (p5.js:88974:25)
    at Wall.distanceTo (be2587dc-633d-49a5-9bee-00e3572370cd:524:24)
    at drawObjects (be2587dc-633d-49a5-9bee-00e3572370cd:88:36)
    at draw (be2587dc-633d-49a5-9bee-00e3572370cd:23:3)
    at _main.default.redraw (p5.js:68314:25)
    at _draw (p5.js:60836:23)
  • at Function.sub (p5.js:88974:25) belongs to p5js library itself.
  • at Wall.distanceTo (...:524:24) is from your own sketch.

This is your Wall::distanceTo() method from lines 522 to 534:

  distanceTo(x, y) {
    let v = createVector(x, y);
    let ab = p5.Vector.sub(this.b, this.a);
    let av = p5.Vector.sub(v, this.a);
    let t = av.dot(ab) / ab.dot(ab);
    if (t < 0) {
      t = 0;
    } else if (t > 1) {
      t = 1;
    }
    let point = p5.Vector.add(this.a, p5.Vector.mult(ab, t));
    return p5.Vector.sub(v, point).mag();
  }

The exception is thrown from line 524: let ab = p5.Vector.sub(this.b, this.a);

I couldn’t find any properties called a or b inside your class Wall anywhere!

  1. Circle-Circle
  2. Rect-Rect
  3. Circle-Rect