0

I'm trying to recreate a sol lewitt 340 wall drawing using p5.js. I have got the majority of it completed, I'm just struggling to keep the lines inside the different shapes. https://massmoca.org/event/walldrawing340/

I have managed to get the ellipse done by adding another ellipse to cut the remaining lines out. let me know if you can help.

// Code Below //

function setup() {
  createCanvas(800, 450);
}

function draw() {
  background(255);
  
  noStroke();
  fill(255, 0, 0); // top left
  rect(0, 0, 200, 200);
  for (let x = 50; x < 150; x += 4) {
    stroke(255, 255, 0);
    line(x, 50, x, 150)
  }
  
  strokeWeight(40);
  stroke(255, 0, 0);
  noFill();
  ellipse(100, 100, 140, 140);
  strokeWeight(1);
  stroke(0, 0, 255);
  for (let i = 0; i <= 200; i += 5) {
    line(0, i, 200, i)

  }

  fill(255, 255, 0); // top middle
  rect(250, 0, 200, 200);
  fill(255);
  stroke(255, 0, 0)
  for (let i = 0; i <= 200; i += 4) {
    line(450, i, 250, i)
  }
  
  fill(255, 255, 0);
  rect(300, 50, 100, 100); // square
  for (let x = 300; x < 400; x += 3) {
    stroke(0, 0, 255);
    line(x, 150, x, 50)
  }

  fill(0, 0, 255); // top right
  rect(500, 0, 200, 200);
  stroke(255, 255, 0);
  for (let i = 0; i <= 200; i += 3) {
    line(700, i, 500, i)
  }

  triangle(600, 50, 650, 150, 550, 150); // triangle
  fill(0, 0, 255);
  for (let x = 550; x < 650; x += 2) {
    stroke(255, 0, 0);
    line(x, 150, x, 50)
  }

  fill(255, 255, 0); //bottom middle
  rect(250, 250, 200, 200);
  fill(255);
  stroke(255, 0, 0);
  for (let i = 250; i <= 450; i += 3) {
    line(450, i, 250, i)
  }
  
  quad(255, 300, 300, 400, 400, 400, 445, 300); // trapeziod
  for (let x = 255; x < 445; x += 2) {
    stroke(0, 0, 255);
    line(x, 300, x, 400)
  }

  fill(255, 0, 0); // bottom left
  rect(0, 250, 200, 200);
  fill(255);
  stroke(255, 255, 0);
  for (let i = 250; i <= 450; i += 2) {
    line(0, i, 200, i)
  }
  
  rect(35, 300, 130, 100); // rectangle
  for (let x = 35; x < 166; x += 2) {
    stroke(0, 0, 255);
    line(x, 300, x, 400)
  }

  fill(0, 0, 255); // bottom right
  rect(500, 250, 200, 200);
  fill(255);
  stroke(255, 255, 0);
  for (let i = 250; i <= 450; i += 3) {
    line(500, i, 700, i)
  }
  
  quad(515, 300, 620, 300, 680, 400, 570, 400); // parallelogram
  for (let x = 515; x < 680; x += 2) {
    stroke(255, 0, 0);
    line(x, 300, x, 400)
  }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
Paul Wheeler
  • 18,988
  • 3
  • 28
  • 41
Yakob
  • 159
  • 1
  • 7
  • ["Can Someone Help Me" is not an actual question](https://meta.stackoverflow.com/questions/284236/why-is-can-someone-help-me-not-an-actual-question) – Rob Aug 19 '21 at 23:24
  • I've updated the title of your post to make it actually ask a question (which is I think what you want to know). – Paul Wheeler Aug 20 '21 at 20:02
  • 1
    You can find my approach in [this answer](https://stackoverflow.com/questions/57546467/is-it-possible-to-make-canvas-with-background-with-lines-or-canvas-that-isnt-a/63730415#63730415). Welcome ! Take your time to [take the tour](https://stackoverflow.com/tour) to make yourself familiar with how stackoverflow is different from other sites to make most out it. Out of curiosity is this and assignment ? If so, for what course ? It sounds interesting and I'd love to learn more. – George Profenza Aug 20 '21 at 23:53
  • Hi George, this is indeed for an assignment, the course is called creative coding, basically, for the final assignment we create a basic game such as (space invaders), this is just the start of the course where we are learning to draw and position shapes and using for each statements – Yakob Aug 21 '21 at 01:19
  • Which university offers this creative coding course ? Thank you for the details Yakob and best of luck with the course and assignments. Sounds like a fun one! – George Profenza Aug 23 '21 at 19:24

0 Answers0