1

This is the error I am getting:

TypeError: Cannot read properties of undefined (reading 'grid') at undefined:56173:43

p5.js says: An error with message "Cannot read properties of undefined (reading 'grid')" occured inside the p5js library when rect was called (on line 11 in d0926fbe-cfb1-4706-8738-6e15c62ca029 [blob:https://preview.p5js.org/d0926fbe-cfb1-4706-8738-6e15c62ca029:11:6])

If not stated otherwise, it might be an issue with the arguments passed to rect. (http://p5js.org/reference/#/p5/rect)

And here is the code:

let bg;
function setup() {
  createCanvas(600, 600);
  bg = createGraphics(600, 600, WEBGL);
  bg.fill(100);
  bg.stroke(100);
}

function draw() {
  bg.background(0);
  bg.rect(0,0,600,600);
  image(bg,0,0);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.6.0/p5.js"></script>

It should draw a grey rectangle on the buffer and display it as an image on the canvas. Instead it gives me an error that I don't understand and it is driving me insane.

ggorlen
  • 44,755
  • 7
  • 76
  • 106
thing1
  • 31
  • 4

1 Answers1

1

I figured out the issue. It was simply that my index.html file included the JS directory: https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.2.0/p5.js

This is an outdated version, and that was causing the issue, because they have since released 1.6.0, and the documentation I was using was made for 1.6.0

thing1
  • 31
  • 4