PVectorとは
PVector v1=new PVector(width/2, 10);//(x,y)保存？ PVector v2=new PVector(10, height/2); void setup() { size(100, 100); colorMode(HSB, 360, 100, 100); background(0, 0, 100); noLoop(); } int r=12; void draw() { fill(0, 100, 100); ellipse(v1.x, v1.y, r, r); fill(90, 100, 100); ellipse(v2.x, v2.y, r, r); v2.add(v1);//←なにこれ？ fill(180, 100, 100); ellipse(v2.x, v2.y, r*2, r*2); //上から２つ目のellipseとの座標の違いが分からない。描画が違うのはなぜ？ }
疑問とか色々コードの中に書いていった。これを解決するのがこれからの課題。わかることは円が書かれることとその位置くらい。
第5回 Processing実習 1 : 動きを生みだす – アニメーションとベクトル | yoppa orgでPVectorというものが紹介されてた。読んだけどよくわからない。とりあえずProcessingのreference見に行った。 PVector \ Language (API) \ Processing 2+のsanpleコードをちょっと整理して変えた。そしてその理解度が上のコード。
更新のお知らせ
更新しました。他にも来るべき人はたくさんいるはずなのにあんまり来ない。
他の人はどんなことをしてるんだろう。気になる。
4色
void setup() { size(500, 500); colorMode(HSB, 360, 100, 100); background(0, 0, 100); } void draw() { pushMatrix(); stroke(0, 0, 100); translate(width/2, height/2); rotate(PI/4); fill(0, 100, 100); beginShape(); for (int i=0; i<100; i=i+1) { vertex(random(width), random(height)); } endShape(); rotate(PI); fill(180, 100, 100); beginShape(); for (int i=0; i<100; i=i+1) { vertex(random(width), random(height)); } endShape(); rotate(PI/2); fill(90, 100, 100); beginShape(); for (int i=0; i<100; i=i+1) { vertex(random(width), random(height)); } endShape(); rotate(PI); fill(180+90, 100, 100); beginShape(); for (int i=0; i<100; i=i+1) { vertex(random(width), random(height)); } endShape(); popMatrix(); }
もじゃもじゃカラフル。rotateのしくみを完全に理解してないせいで苦戦した
y=1/2x²-9x-7
float x=0; float y=0; float a=0.5; float b=-9; float c=-7; void setup() { size(600, 600); colorMode(HSB, 360, 100, 100); background(0, 0, 100); line(0, width/2, height, width/2); line(width/2, 0, width/2, height); } void draw() { pushMatrix(); translate(width/2, height/2); rotate(PI); for (float x=-300; x<300; x=x+1) { y=a*x*x+b*x+c; //strokeWeight(5); noStroke(); fill(0, 0, 0); ellipse(x, y, 5, 5); } popMatrix(); }
中学数学を勉強しなおすことになった。グラフ考えるのめんどくさいからprocessingで書いてくれないかなぁと思って作った。y=x²はなぜか表示されない（？）２次関数限定（？）ちょっと何がどうなってこうなったのか分からないけど何かできた、というのが今回のスケッチにおける私の感想。
整列理解
自由に動いてもらう - 記録で使った整列はどう動いているか理解するための図にしてみた。
iの値が同じもので1つのものを動かしている。（表では縦に関連性があり、その情報でできている）
間違えてるかもしれない。
自由に動いてもらう
int[] x = new int[9]; int[] y = new int[9]; float[]speedX = new float[9]; float[]speedY = new float[9]; color[]c=new color[9]; color[]c2=new color[9]; int a=(int)random(1, 5); int b=(int)random(1, 5); int[]r=new int[9]; void setup() { size(500, 500); colorMode(HSB, 360, 100, 100); background(0, 0, 0); x[0] = 0; y[0] = (int)random(height); x[1] = width; y[1] = (int)random(height); x[2] = (int)random(width); y[2] = 0; x[3] = (int)random(width); y[3] = height; x[4] = 0; y[4] = (int)random(height); x[5] = width; y[5] = (int)random(height); x[6] = (int)random(width); y[6] = 0; x[7] = (int)random(width); y[7] = height; x[8] = width/2; y[8] = height/2; speedX[0]=a; speedY[0]=b; speedX[1]=a; speedY[1]=b; speedX[2]=a; speedY[2]=b; speedX[3]=a; speedY[3]=b; speedX[4]=a; speedY[4]=b; speedX[5]=a; speedY[5]=b; speedX[6]=a; speedY[6]=b; speedX[7]=a; speedY[7]=b; speedX[8]=a; speedY[8]=b; c[0]=color(random(360), 100, 100); c[1]=color(random(360), 100, 100); c[2]=color(random(360), 100, 100); c[3]=color(random(360), 100, 100); c[4]=color(random(360), 100, 100); c[5]=color(random(360), 100, 100); c[6]=color(random(360), 100, 100); c[7]=color(random(360), 100, 100); c[8]=color(random(360), 100, 100); c2[0]=color(0, 0, random(100)); c2[1]=color(0, 0, random(100)); c2[2]=color(0, 0, random(100)); c2[3]=color(0, 0, random(100)); c2[4]=color(0, 0, random(100)); c2[5]=color(0, 0, random(100)); c2[6]=color(0, 0, random(100)); c2[7]=color(0, 0, random(100)); c2[8]=color(0, 0, random(100)); stroke(0, 0, 100); r[0]=(int)random(1, 20); r[1]=(int)random(1, 20); r[2]=(int)random(1, 20); r[3]=(int)random(1, 20); r[4]=(int)random(1, 20); r[5]=(int)random(1, 20); r[6]=(int)random(1, 20); r[7]=(int)random(1, 20); r[8]=(int)random(1, 20); } void draw() { int i; //background(0, 0, 0); //fill(0, 0, 0, 50); //rect(0, 0, width, height); for (i = 0; i < 9; ++i) { x[i] += speedX[i]; y[i] += speedY[i]; if (x[i] <= 0 || x[i] >= width) { speedX[i] *= -1; //speedX[i] *= random(0.3, 1.1); speedX[i]=random(-5, 5); //speedY[i] *= speedY[i]+random(0.9, 1); } if (y[i] <= 0 || y[i] >= height) { speedY[i] *= -1; //speedX[i] =speedX[i]+random(0.9, 1); speedY[i]=random(-5, 5); //speedY[i]*=random(0.3, 1.1); } fill(c[i]); stroke(c2[i]); ellipse(x[i], y[i], r[i], r[i]); } }
昨日の矢印の個性 - 記録よりもさらにばらばらになった。左方、上方、右方、下方それぞれから２つずつ、ランダムな場所からと、中央から１つ自由に動き回るようにした。さらにstrokeを黒⇔白でランダムに決定し、色付けている。
矢印の個性
int[] x = new int[9]; int[] y = new int[9]; float[]speedX = new float[9]; float[]speedY = new float[9]; color[]c=new color[9]; int a=(int)random(1, 5); int b=(int)random(1, 5); int[]r=new int[9]; void setup() { size(800, 800); colorMode(HSB, 360, 100, 100); background(0, 0, 0); x[0] = 0; y[0] = 0; x[1] = 20; y[1] = 20; x[2] = 40; y[2] = 40; x[3] = 60; y[3] = 60; x[4] = 80; y[4] = 80; x[5] = 60; y[5] = 80; x[6] = 40; y[6] = 80; x[7] = 80; y[7] = 60; x[8] = 80; y[8] = 40; speedX[0]=a; speedY[0]=b; speedX[1]=a; speedY[1]=b; speedX[2]=a; speedY[2]=b; speedX[3]=a; speedY[3]=b; speedX[4]=a; speedY[4]=b; speedX[5]=a; speedY[5]=b; speedX[6]=a; speedY[6]=b; speedX[7]=a; speedY[7]=b; speedX[8]=a; speedY[8]=b; c[0]=color(random(360), 100, 100); c[1]=color(random(360), 100, 100); c[2]=color(random(360), 100, 100); c[3]=color(random(360), 100, 100); c[4]=color(random(360), 100, 100); c[5]=color(random(360), 100, 100); c[6]=color(random(360), 100, 100); c[7]=color(random(360), 100, 100); c[8]=color(random(360), 100, 100); stroke(0, 0, 100); r[0]=(int)random(1, 20); r[1]=(int)random(1, 20); r[2]=(int)random(1, 20); r[3]=(int)random(1, 20); r[4]=(int)random(1, 20); r[5]=(int)random(1, 20); r[6]=(int)random(1, 20); r[7]=(int)random(1, 20); r[8]=(int)random(1, 20); } void draw() { int i; //background(0, 0, 0); //fill(0, 0, 0, 50); //rect(0, 0, width, height); for (i = 0; i < 9; ++i) { x[i] += speedX[i]; y[i] += speedY[i]; if (x[i] <= 0 || x[i] >= width) { speedX[i] *= -1; //speedX[i] *= random(0.3, 1.1); speedX[i]=random(-5, 5); //speedY[i] *= speedY[i]+random(0.9, 1); } if (y[i] <= 0 || y[i] >= height) { speedY[i] *= -1; //speedX[i] =speedX[i]+random(0.9, 1); speedY[i]=random(-5, 5); //speedY[i]*=random(0.3, 1.1); } //if (x[i] > width) { // x[i]=width; // speedX[i]=speedX[i]+1; //} //if (x[i] <0) { // x[i]=0; // speedY[i]=speedY[i]+1; //} //if (y[i] > height) { // y[i]=height; // speedX[i]=speedX[i]+1; //} //if (y[i] < 0) { // y[i]=0; // speedX[i]=speedX[i]+1; //} fill(c[i]); ellipse(x[i], y[i], r[i], r[i]); } }
さらなるバラバラ感を出したくて。もはや矢印だとわからない時もあるが、強弱があるので矢印がバラバラに - 記録よりは面白いものにはなったかなと。小さいものが速いと可愛いと思う。できるかなー。
