let H = 140;

​

function setup() {

  createCanvas(595,842, SVG);

  strokeWeight(1);

  //stroke(0);

  noFill();

​

}

​

function draw() {

  //background(255);

  ellipseMode(RADIUS);

  rectMode(CENTER);

  angleMode(DEGREES);

​

​

​

  //////GRILLE (à effacer)

  stroke(230);

  textSize(10);

  //vertical

  line(L, 0, L, height);

  line(L*2, 0, L*2, height);

  line(L*3, 0, L*3, height); 

  line(L*4, 0, L*4, height);

​

  //horizontal

  line(0, H, width, H);

  line(0, H*2, width, H*2);

  line(0, H*3, width, H*3);

  line(0, H*4, width, H*4);

  line(0, H*5, width, H*5);

​

  text('1', 20, 20);

  text('2', L+20, 20);

  text('3', L*2+20, 20);

  text('4', L*3+20, 20);

  text('5', L*4+20, 20);

  text('6', 20, H+20);

  text('7', L+20, H+20);

  text('8', L*2+20, H+20);

  text('9', L*3+20, H+20);

  text('10', L*4+20, H+20);

  text('11', 20, H*2+20);

  text('12', L+20, H*2+20);

  text('13', L*2+20, H*2+20);

  text('14', L*3+20, H*2+20);

  text('15', L*4+20, H*2+20);

  text('16', 20, H*3+20);

  text('17', L+20, H*3+20);

  text('18', L*2+20, H*3+20);

  text('19', L*3+20, H*3+20);

  text('20', L*4+20, H*3+20);

  text('21', 20, H*4+20);

  text('22', L+20, H*4+20);

  text('23', L*2+20, H*4+20);

  text('24', L*3+20, H*4+20);

  text('25', L*4+20, H*4+20);

  text('26', 20, H*5+20);

  text('27', L+20, H*5+20);

  text('28', L*2+20, H*5+20);

  text('29', L*3+20, H*5+20);

  text('30', L*4+20, H*5+20);

  //////GRILLE (à effacer)

​

​

  ////////////////////////////////////////////

  stroke(0);

  //////////////// CIRCLES

  //1

  var circleX = random(30,L);

  var circleY = random(30,H-30);

  var circleSize1 = random(2, 30);

  ellipse(circleX, circleY, circleSize1);

  //2

  var circle3 = random(L,L*2);

  var circle4 = random(30,H-30);

  ellipse(circle3, circle4, circleSize1+4);

  //3

  var circle5 = random(L*2,L*3);

  var circle6 = random(30,H-30);

  ellipse(circle5, circle6, circleSize1+7);

  //4

  var circle7 = random(L*3,L*4);

  var circle8 = random(30,H-30);

  ellipse(circle7, circle8, circleSize1+2);

  //5

  var circle9 = random(L*4,L*5);

  var circle10 = random(30,H-30);

  ellipse(circle9, circle10, circleSize1+9);

  //

  //6

  var circle11 = random(30,L);

  var circle12 = random(H,H*2);

  ellipse(circle11, circle12, circleSize1+4.5);

  //7

  var circle13 = random(L+30,L*2);//on ajoute à chaque case

  var circle14 = random(H,H*2);//2e ligne

  ellipse(circle13, circle14, circleSize1+6);

  //8

  var circle15 = random(L*2,L*3);

  var circle16 = random(H,H*2);

  ellipse(circle15, circle16, circleSize1+9.12);

  //9

  var circle17 = random(L*3,L*4);

  var circle18 = random(H,H*2);

  ellipse(circle17, circle18, circleSize1+3);

  //10

  var circle19 = random(L*4,L*5);

  var circle20 = random(H,H*2);

  ellipse(circle19, circle20, circleSize1*2);

  //

  //11

  push();

  var circle21 = random(30,L);

  var circle22 = random(H*2,H*3);

  ellipse(circle21, circle22, circleSize1+6.7);

  pop();

  //12

  push();

  var circle23 = random(L+30,L*2);

  var circle24 = random(H*2,H*3);

  ellipse(circle23, circle24, circleSize1+2);

  pop();

  //13

  push();

  var circle25 = random(L*2,L*3);

  var circle26 = random(H*2,H*3);

  ellipse(circle25, circle26, circleSize1+4.7);

  pop();

  //14

  push();

  var circle27 = random(L*3,L*4);

  var circle28 = random(H*2,H*3);

  ellipse(circle27, circle28, circleSize1+8.1);

  pop();

  //15

  push();

  var circle29 = random(L*4,L*5);

  var circle30 = random(H*2,H*3);

  ellipse(circle29, circle30, circleSize1+5);

  pop();

  //////////////// RECTANGLES

  //1

  push();

  rotate(10);

  var rectC = random(30,L);

  var rectD = random(30,H-30);

  rect(rectC, rectD, circleSize1, circleSize1);

  pop();

  //2

  push();

  rotate(10);

  var rect3 = random(L+30,L*2);

  var rect4 = random(0,H-30);

  rect(rect3, rect4, circleSize1+20, circleSize1+20);

  pop();

​

  //3

  push();

  rotate(-3);

  var rect5 = random(L*2,L*3);

  var rect6 = random(0,H-30);

  rect(rect5, rect6, circleSize1+10, circleSize1+10);

  pop();

  //4

  push();

  rotate(3);

  var rect7 = random(L*3,L*4);

  var rect8 = random(0,H-30);

  rect(rect7, rect8, circleSize1+5, circleSize1+5);

  pop();

  //5

  push();

  rotate(4);

  var rect9 = random(L,L*2);

  var rect10 = random(0,H-30);

  rect(rect9, rect10, circleSize1+2, circleSize1+2);

  pop();

  //

  //6

  push();

  rotate(4);

  var rect11 = random(30,L);

  var rect12 = random(H,H*2);

  rect(rect11, rect12, circleSize1+3, circleSize1+3);

  pop();

  //7

  push();

  rotate(6);

  var rect13 = random(L+30,L*2);

  var rect14 = random(H,H*2);

  rect(rect13, rect14, circleSize1+6, circleSize1+6);

  pop();

  //8

  push();

  rotate(2);

  var rect15 = random(L*2,L*3);

  var rect16 = random(H,H*2);

  rect(rect15, rect16, circleSize1+4, circleSize1+4);

  pop();

  //9

  push();

  rotate(3);

  var rect17 = random(L*3,L*4);

  var rect18 = random(H,H*2);

  rect(rect17, rect18, circleSize1+2, circleSize1+2);

  pop();

  //10

  push();

  rotate(-7);

  var rect19 = random(L*4,L*5);

  var rect20 = random(H,H*2);

  rect(rect19, rect20, circleSize1+7, circleSize1+7);

  pop();

  //

  //11

  push();

  rotate(6);

  var rect21 = random(30,L);

  var rect22 = random(H*2,H*3);

  rect(rect21, rect22, circleSize1+3, circleSize1+3);

  pop();

  //12

  push();

  rotate(-4);

  var rect23 = random(L,L*2);

  var rect24 = random(H*2,H*3);

  rect(rect23, rect24, circleSize1+9, circleSize1+9);

  pop();

  //13

  push();

  rotate(7);

  var rect25 = random(L*2,L*3);

  var rect26 = random(H*2,H*3);

  rect(rect25, rect26, circleSize1, circleSize1);

  pop();

  //14

  push();

  rotate(2);

  var rect27 = random(L*3,L*4);

  var rect28 = random(H*2,H*3);

  rect(rect27, rect28, circleSize1+6, circleSize1+6);

  pop();

  //15

  push();

  rotate(6);

  var rect29 = random(L*4,L*5);

  var rect30 = random(H*2,H*3);

  rect(rect29, rect30, circleSize1+7, circleSize1+7);

  pop();

  //////////////// TRIANGLES

  //1

  push();

  rotate(8);

  triangle(circleX, circleX, circleSize1, circleX, circleX, circleSize1);

  pop();

  //2

  push();

  rotate(7);

  translate(L, 0);

  triangle(circleX, circleX, 100, circleX, circleX, 100);

  pop();

​

  //3

  push();

  rotate(-9);

  translate(L*2, 0);

  triangle(circleX, circleX, 40, circleX, circleX, 40);

  pop();

  //4

  push();

  rotate(6);

  translate(L*3, 0);

  triangle(circleX, circleX, 30, circleX, circleX, 30);

  pop();

  //5

  push();

  rotate(3);

  translate(L*4, 0);

  triangle(circleX, circleX, 70, circleX, circleX, 70);

  pop();

  //

  //6

  push();

  rotate(8);

  translate(0, H);

  triangle(circleX, circleX, 20, circleX, circleX, 20);

  pop();

  //7

  push();

  rotate(6);

  translate(L, H);

  triangle(circleX, circleX, 50, circleX, circleX, 50);

  pop();

​

  //8

  push();

  rotate(4.78);

  translate(L*2, H);

  triangle(circleX, circleX, 90, circleX, circleX, 90);

  pop();

  //9

  push();

  rotate(6.4);

  translate(L*3, H);

  triangle(circleX, circleX, 10, circleX, circleX, 10);

  pop();

  //10

  push();

  rotate(-2);

  translate(L*4, H);

  triangle(circleX, circleX, 34, circleX, circleX, 34);

  pop();

  //

  //11

  push();

  rotate(5);

  translate(0, H*2);

  triangle(circleX, circleX, 60, circleX, circleX, 60);

  pop();

  //12

  push();

  rotate(6);

  translate(L, H*2);

  triangle(circleX, circleX, 10, circleX, circleX, 10);

  pop();

  //13

  push();

  rotate(4);

  translate(L*2, H*2);

  triangle(circleX, circleX, 40, circleX, circleX, 40);

  pop();

  //14

  push();

  rotate(4.78);

  translate(L*3, H*2);

  triangle(circleX, circleX, 20, circleX, circleX, 20);

  pop();

  //15

  push();

  rotate(6);

  translate(L*4, H*2);

  triangle(circleX, circleX, 30, circleX, circleX, 30);

  pop();

  noLoop(); 

}

​

​

​

​

​

​

​

​

function keyTyped() {

 if (key == "s") {

 save("01.svg");

 //save('myCanvas.jpg');

 }

  }

​