【p5js/プログラミング】浦島太郎。

Art

2020.04.03

こんにちは、たやち（tayati369）です。

p5.jsでコーディングしてみました。
PCD@Tokyoさんの「デイリーコーディングチャレンジ」！！に素人極まりない私も参加しております。
毎日できるかわからないけれど、リモートワークのご時世時間があるでチャレンジしていきます。（デイリーとはｗ）

3日目のテーマは「浦島太郎」。
ということで、亀の甲羅をイメージして、作りました。これまた超簡単コードですが、自分なりにclassの使い方の勉強になったかなと思いました。
オブジェクトを順番に配置するために、translate(x,y)使っているけど、もっといい方法あるのかな。

ごらんあれ〜。

let num =6
let r = 50
let tile = []

function setup() {
  createCanvas(500,500)
  background('#FFD700')
  for (var i = 0; i < 9; i++) {
    tile[i] = new Tile()
  }
  angleMode(DEGREES)
}

function draw() {
  for (var j = 1; j <= 9; j++) {
    let cnt = j
    push()
    if (cnt%2==1) {
      translate(r*1.7,r)
    }else {
      translate(r*1.7,-r)
    }
    for (var i = 0; i < 9; i++) {
      push()
      translate(-2*r,2*r*i)
      tile[i].show()
      pop()
    }
  }
  pop()
}

class Tile {
  show(){
    noStroke()
    fill('#6B8E23')
    beginShape()
    push()
    for (let i = 0; i < num; i++) {
      let theta = i * 360 / num
      let x = r * cos(theta)
      let y = r * sin(theta)
      vertex(x, y)
    }
    endShape(CLOSE)
    pop()
  }
}

ではでは、さようなら〜〜〜。

なにかあればTwitterまで。