【p5.js/プログラミング】くるくるお目め。

Art

こんにちは、たやち(tayati369)です。

今回は初めてのp5.jsでコーディングしてみました。
前々から、p5.jsの存在は知っていたのですが、Processingでまずコードを書くことに慣れていこうと考えていたので手を付けていませんでした。

今回p5.jsを使おうと思ったきっかけは、自分のPC以外でコードを書いたときにShareの一手間が少ないというところです。

OpenProcessingやp5.jsのWebエディタに保存しておけば、ログインした段階でどのPCでも保存しておいたコードが編集できるのは革命でした。こんな便利ならはじめから利用しておけばよかったと思いました。。

今後はp5.jsで絵を書くことも多くなると思います!

なんとなく写輪眼をイメージして。よかったら使ってみてください。

 

function setup() {
  createCanvas(400, 400);
  noLoop();
  colorMode(HSB,360,100,100);
}

function draw() {
  background(220);
  let x=width/2;
  let y=height/2;
  let r=300;
 // noStroke();
  circle(x,y,r);
  
  for(let i=0;i<360;i++){
    let x1=x+r/2*cos(i);
    let x2=x+r/2*cos(i+90);
    let x3=x+r/2*cos(i+180);
    let y1=y+r/2*sin(i);
    let y2=y+r/2*sin(i+90);
    let y3=y+r/2*sin(i+180);
//    stroke(i,100,100);
    triangle(x1,y1,x2,y2,x3,y3);
  }
  fill(0,0,30);
  circle(x-6,y,r/2+2);
  save("sample.png");
}

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

コメント