P5js pixels not working

p5.js Beginners
1

hi all, this program does not work, I am copying a tutorial from The Coding Train which seems to work: https://youtu.be/nMUMZ5YRxHI?t=533

My test has no pixel being displayed, why?

<head>
<script src="https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js"></script>
<style type="text/css">	
  html, body {	
    margin: 0;	
    padding: 0;	
  } 	
  body {
    display:flex;
    justify-content: center;
    align-items: center;
  }
</style>
</head>
<body>
<script type="text/javascript">

  function setup() { 
    createCanvas(360, 360);  
  } 
  function draw() { 
    background(200);
    loadPixels();
      pixels[0] = color(255,0,0);
      pixels[1] = color(255,0,0);
      pixels[2] = color(255,0,0);
      pixels[3] = color(255,0,0);            
    updatePixels();

  }

</script>
</body>
</html>```
1 Like
2

p5js.org/reference/#/p5/pixels

3 Likes
3

also check out this math
https://editor.p5js.org/kll/sketches/G8UOHRv8

2 Likes