# My projects library #2! - CodeMasterX's gallery megathread

Hi! In the previous megathread I reached the max amount of edits. Therefore I started a new one. With the experience I gained from the previous thread, I implemented some changes!

# Contents:

• #20 Sierpiński triangle
• #21 Vector sum program
• #22 Chess grid
• #23 Spiral of theodorus
• #24 Overlapping rectangles
• #25 Lerp picture
• #26 Square spiral
• #27 Rectangle - Circle interception
• #28 Micro spirograph
• #29 Triangle fractal
• #30 Sin wave sum

# Instructions:

• whenever you want to reference a post, use the #[number] of the post. For example, if you want to reference the “Sibstinski triangle” post, use #20; [comment]. If you want to reference several, just use #20,#21,#22,…

All code will be available in the

Code

Hello!

tag.
If a project is short / I have the patience to do so, I’ll add several sub sections, where I will add things like explained code, shortened code, efficient code,…

If you to suggest a project, use [idea] in the post. So, for example, (text) [idea]: “create tetris!”

#20 Sierpiński triangle Java mode

Logic

Create a triangle, and when a function is called, split it into 3 around it. Repeat until satisfied.

Instructions

A triangle is created and when you want to create the next iteration, just press any key. If you press space key, you will erase it all, but the first, effectively restarting the program.

Code
My first attempt
``````int iter = 0, cx = 300, cy = 350, n=3, r=100;
float off = PI/2/n*(ceil(n/2)), m = 0.5;
ArrayList<t> ts = new ArrayList<t>();
void setup() {
size(600, 600);
}
void draw() {
background(0);
stroke(255);
for (int i = 0; i < ts.size(); i++) {
ts.get(i).display();
}
}
class t {
float x, y, r;
int it;
t(int it_, float x_, float y_, float r_) {
it = it_;
x = x_;
y = y_;
r = r_;
}
void display() {
for (int i = 0; i < n; i++) {
float a = TWO_PI/n;
line(cos(a*i-off)*r+x, sin(a*i-off)*r+y, cos(a*(i+1)-off)*r+x, sin(a*(i+1)-off)*r+y);
}
}
void splitT() {
for (int i = 0; i < n; i++) {
float a = TWO_PI/n;
}
}
}
void keyPressed() {
if (key != ' ') {
splitShapes();
iter++;
} else {
iter = 0;
ts.clear();
}
}

void splitShapes() {
for (int i = 0, s = ts.size(); i < s; i++) {
if (ts.get(i).it == iter) ts.get(i).splitT();
}
}

``````
Shortened
``````float iter = 0, cx = 300, cy = 350, n=3, r=100, off = PI/2/n*(ceil(n/2)), m = 0.5, a = TWO_PI/n;
ArrayList<t> ts = new ArrayList<t>();
void setup() {
size(600, 600);
}
void draw() {
background(0);
stroke(255);
for (int i = 0; i < ts.size(); i++) ts.get(i).display();
}
class t {
float x, y, r;
int it;
t(int it_, float x_, float y_, float r_) {
it = it_;
x = x_;
y = y_;
r = r_;
}
void display() {
for (int i = 0; i < n; i++) line(cos(a*i-off)*r+x, sin(a*i-off)*r+y, cos(a*(i+1)-off)*r+x, sin(a*(i+1)-off)*r+y);
}
void splitT() {
for (int i = 0; i < n; i++) ts.add(new t(it+1, x+cos(a*i+off)*r, y+sin(a*i+off)*r, r*m));
}
}
void keyPressed() {
if (key != ' ') splitShapes();
else {
iter = 0;
ts.clear();
}
}

void splitShapes() {
iter++;
for (int i = 0, s = ts.size(); i < s; i++) if (ts.get(i).it == iter) ts.get(i).splitT();
}

``````
Explained
``````int iter = 0, cx = 300, cy = 350, n=3, r=100; //iter is used to not repeat the previous actions, n is just a constant for 3, r is the radius
float off = PI/2/n*(ceil(n/2)), m = 0.5; //off is to offset the rotation, m is to decrease the size of triangles
ArrayList<t> ts = new ArrayList<t>(); //array of triangles
void setup() {
size(600, 600);
}
void draw() {
background(0);
stroke(255);
for (int i = 0; i < ts.size(); i++) {
ts.get(i).display(); //displaying all of the triangles
}
}
class t { //class t, stands for triangle
float x, y, r; //center of the triangle, with size r
int it; //iteration of the triangle
t(int it_, float x_, float y_, float r_) {
it = it_;
x = x_;
y = y_;
r = r_;
}
void display() { //function which is called in draw, which displays the triangles
for (int i = 0; i < n; i++) {
float a = TWO_PI/n;
line(cos(a*i-off)*r+x, sin(a*i-off)*r+y, cos(a*(i+1)-off)*r+x, sin(a*(i+1)-off)*r+y);
}
}
void splitT() { //splitting the triangle in 3
for (int i = 0; i < n; i++) {
float a = TWO_PI/n;
}
}
}
void keyPressed() {
if (key != ' ') { //if key != space, it will split the triangles
splitShapes();
iter++;
} else {  //clears the triangles and adds the original one
iter = 0;
ts.clear();
}
}

void splitShapes() { //loops splitT function
for (int i = 0, s = ts.size(); i < s; i++) {
if (ts.get(i).it == iter) ts.get(i).splitT();
}
}

``````
1 Like

#21 Vector sum program Java mode

Code
Original + Example
``````void setup() {} void draw() {
PVector a = new PVector(1,2), b = new PVector(-1,-2,3), c = new PVector(1,2,-3);
PVector abc[] = {a, b, c };
println(vectorSum(a,b,c),vectorSum(abc),vectorSum(vectorSum(abc),a,b,c) );

noLoop();
}

PVector vectorSum(PVector... pv) {
PVector sum = new PVector(0,0,0);
for(int i = 0; i < pv.length; i++) sum.add(pv[i]);
return (sum );
}
``````
Shortened + Example
``````void setup() {} void draw() {
PVector a = new PVector(1,2), b = new PVector(-1,-2,3), c = new PVector(1,2,-3);
PVector abc[] = {a, b, c };
println(vectorSum(a,b,c),vectorSum(abc),vectorSum(vectorSum(abc),a,b,c) );
noLoop();
}
PVector vectorSum(PVector... pv) {
PVector sum = new PVector(0,0,0);
for(int i = 0; i < pv.length; i++) sum.add(pv[i]);
return (sum );
}
``````
Funcion
``````PVector vectorSum(PVector... pv) {
PVector sum = new PVector(0,0,0);
for(int i = 0; i < pv.length; i++) sum.add(pv[i]);
return (sum );
}
``````

#22 Chess grid Java mode

Code
original
``````int w = 8, h = 8, scl = 100;
PImage source;
ArrayList<PImage> sprites = new ArrayList<PImage>();
int grid[][] = new int[w][h];
void setup() {
size(800, 800);
}
imageMode(3);
float m = 1.333, scl = 130*m, xoff = 10*m, yoff = 10*m, xbuffer=20*m, ybuffer=20*m;
for (int j = 0; j < 2; j++) for (int i = 0; i < 6; i++) sprites.add(source.get(floor(xoff+i*scl+(i*xbuffer)), floor(yoff+j*scl+(j*ybuffer)), floor(scl), floor(scl)));
for (int i = 0; i < sprites.size(); i++) {
sprites.set(i, shrink(sprites.get(i), 0.5, 0.5));
}
/*displaying images*/ // for (int i = 0; i < 6; i++) for (int j = 0; j < 2; j++) image(sprites.get(i+j*6), floor(xoff+i*scl+(i*xbuffer)), floor(yoff+j*scl+(j*ybuffer)));
}
PImage shrink(PImage input, float sx, float sy) {
input.resize(floor(input.width*sx), floor(input.height*sy));
return( input );
}
void displayGrid() {
for (int i = 0; i < w; i++) for (int j = 0; j < h; j++) {
if (grid[i][j] > 0) image(sprites.get(grid[i][j]), (i+0.5)*scl, (j+0.5)*scl);
if (grid[i][j] < 0) image(sprites.get(-grid[i][j]+5), (i+0.5)*scl, (j+0.5)*scl);
}
}
void draw() {
background(0);
noStroke();
for (int j = 0; j < h; j++) for (int i = j % 2; i < w; i+=2) rect(i*scl, j*scl, scl, scl);
image(sprites.get((int)random(sprites.size())), mouseX, mouseY);
displayGrid();
}
``````
short
``````int w = 8, h = 8, scl = 100;
PImage source;
ArrayList<PImage> sprites = new ArrayList<PImage>();
int grid[][] = new int[w][h];
void setup() {
size(800, 800);
}
imageMode(3);
float m = 1.333, scl = 130*m, xoff = 10*m, yoff = 10*m, xbuffer=20*m, ybuffer=20*m;
for (int j = 0; j < 2; j++) for (int i = 0; i < 6; i++) sprites.add(source.get(floor(xoff+i*scl+(i*xbuffer)), floor(yoff+j*scl+(j*ybuffer)), floor(scl), floor(scl)));
for (int i = 0; i < sprites.size(); i++) sprites.set(i, shrink(sprites.get(i), 0.5, 0.5));
}
PImage shrink(PImage input, float sx, float sy) {
input.resize(floor(input.width*sx), floor(input.height*sy));
return( input );
}
void displayGrid() {
for (int i = 0; i < w; i++) for (int j = 0; j < h; j++) {
if (grid[i][j] > 0) image(sprites.get(grid[i][j]), (i+0.5)*scl, (j+0.5)*scl);
if (grid[i][j] < 0) image(sprites.get(-grid[i][j]+5), (i+0.5)*scl, (j+0.5)*scl);
}
}
void draw() {
background(0);
noStroke();
for (int j = 0; j < h; j++) for (int i = j % 2; i < w; i+=2) rect(i*scl, j*scl, scl, scl);
image(sprites.get((int)random(sprites.size())), mouseX, mouseY);
displayGrid();
}
``````
explained
``````int w = 8, h = 8, scl = 100;
PImage source;
ArrayList<PImage> sprites = new ArrayList<PImage>();
int grid[][] = new int[w][h];
void setup() {
size(800, 800);
}
imageMode(3);
float m = 1.333, scl = 130*m, xoff = 10*m, yoff = 10*m, xbuffer=20*m, ybuffer=20*m; //setting variables to fit the image
for (int j = 0; j < 2; j++) for (int i = 0; i < 6; i++) sprites.add(source.get(floor(xoff+i*scl+(i*xbuffer)), floor(yoff+j*scl+(j*ybuffer)), floor(scl), floor(scl)));
for (int i = 0; i < sprites.size(); i++) sprites.set(i, shrink(sprites.get(i), 0.5, 0.5)); //shrinking images to half the size
}
PImage shrink(PImage input, float sx, float sy) { //resizing
input.resize(floor(input.width*sx), floor(input.height*sy));
return( input );
}
void displayGrid() { //displaying the grid
noStroke();
for (int j = 0; j < h; j++) for (int i = j % 2; i < w; i+=2) rect(i*scl, j*scl, scl, scl); //drawing the grid []  []  []  []
for (int i = 0; i < w; i++) for (int j = 0; j < h; j++) {
if (grid[i][j] > 0) image(sprites.get(grid[i][j]), (i+0.5)*scl, (j+0.5)*scl);
if (grid[i][j] < 0) image(sprites.get(-grid[i][j]+5), (i+0.5)*scl, (j+0.5)*scl);
}
}
void draw() {
background(0);
displayGrid();
image(sprites.get((int)random(sprites.size())), mouseX, mouseY);
}
``````

Info

chessPieces2.png:

I am still fixing some bugs but the sprites are there : P

Code
``````int w = 8, h =8, scl = 100, sScl = 173, v = 0, sel = -1;
boolean creative = true;
PImage source;
ArrayList<PImage> sprites = new ArrayList<PImage>();
int grid[][] = new int[w][h];
String board = "11,12,0,0,0,0,6,5,10,12,0,0,0,0,6,4,9,12,0,0,0,0,6,3,8,12,0,0,0,0,6,2,7,12,0,0,0,0,6,1,9,12,0,0,0,0,6,3,10,12,0,0,0,0,6,4,11,12,0,0,0,0,6,5";

void setup() {
imageMode(3);
size(800, 800);
}

void draw() {
noStroke();
displayGrid();
}
void displayGrid() {
background(#50c878);
fill(255);
for (int j = 0; j < h; j++) for (int i = j % 2; i < w; i+=2) rect(i*scl, j*scl, scl, scl);
if(!creative) fill(0, 0, 255);
else noFill();
if (!creative && sel != -1) rect((sel % w)*scl, floor(sel/w)*scl,scl,scl);
for (int i = 0; i < w; i++) for (int j = 0; j < h; j++) if (grid[i][j] != 0) image(sprites.get(grid[i][j]-1), (i+0.5)*scl, (j+0.5)*scl);
if (creative) image(sprites.get(v), mouseX, mouseY);
}

String saveBoard() {
String output = "";
for (int i = 0; i < w; i++) for (int j = 0; j < h; j++) output += grid[i][j]+((( (i == w-1 && j == h-1)? "" : ",")));
return output;
}
int info[] = int(split(input, ","));
for (int i = 0; i < info.length; i++) {
int y = i % w, x = floor(i/w);
grid[x][y] = info[i];
}
}
void mousePressed() {
int mx = constrain(floor(map(mouseX, 0, w*scl, 0, w)), 0, w-1), my = constrain(floor(map(mouseY, 0, h*scl, 0, h)), 0, h-1);
if (creative) grid[mx][my] = ((((mouseButton == LEFT)? v+1 : 0)));
else {
if(grid[mx][my] == 0) sel = sel;
else sel = mx+my*w;
}
}
void mouseWheel(MouseEvent e) {
v -= e.getCount();
if (v > sprites.size()-1) v = 0;
if (v < 0) v = sprites.size()-1;
}

for (int i = 0; i < 12; i++) {
}
for (int i = 0; i < sprites.size(); i++) {
image(sprites.get(i), i*sScl, 0);
}
}
PImage shrink(PImage input, float value) {
input.resize(floor(input.width*value), floor(input.height*value));
return(input);
}
void keyPressed() {
if (key == ' ') println(saveBoard()+"\n");
else if (key == 'c') {
creative = !creative;
}
}
``````

image “sprites.png”

2 Likes

I made a similar Thread with my Sketches but I show them as videos:

1 Like

thank you for showing me that : D

I still have a lot of things to do in P2D before going to 3D.

I am trying to make chess, however I’ll probably wait until I get better after linking movement to sprites.

Don’t know what I was trying to say but yeah.

1 Like

#23 Spiral of theodorus Java mode

Reference image

Logic

Create a line, turn 90 degrees, move x pixels, draw a line to the center, turn 90 degrees, draw the line, and repeat

Code
``````int scl = 50, it = 16;
void setup() {
size(600,600);
stroke(255);
}
void draw() {
background(0);
if(mousePressed) it++;
}
void addPart(float cx, float cy, float x, float y, int rep) {
float dir = atan2(y-cy,x-cx) - PI/2, nx = x + cos(dir)*scl, ny = y + sin(dir)*scl;
stroke(255);
line(cx,cy,x,y);
if(rep != 0) line(nx,ny,x,y);
}
``````
2 Likes

#24 Overlapping rectangles Java mode

Logic

create a rectangle with halfway points. One is at the center, the second is at the left top corner of the previous square

Code
``````ArrayList<lineRect> rects = new ArrayList<lineRect>();
void setup() {
size(600, 600);
drawRect(300, 300, 300,325,true);
for(int i = 0; i < 20; i++) rects.get(rects.size()-1).dup();
}
void draw() {
background(0);
for (int i = 0, q = rects.size(); i < q; i++) rects.get(i).display();
noLoop();
}
void nextIt() {
rects.get(rects.size()-1).dup();
}
void mousePressed() { nextIt(); loop(); }
void drawRect(float x1, float y1, float x2, float y2, boolean save) {
float r = dist(x1, y1, x2, y2);
float dir = atan2(y2-y1, x2-x1);
stroke(255);
float lx = x1 + cos(dir+PI/2)*r/2, ly = y1 + sin(dir+PI/2)*r/2, rx = x1 + cos(dir-PI/2)*r/2, ry = y1 + sin(dir-PI/2)*r/2;
float lx2 = x2 + cos(dir+PI/2)*r/2, ly2 = y2 + sin(dir+PI/2)*r/2, rx2 = x2 + cos(dir-PI/2)*r/2, ry2 = y2 + sin(dir-PI/2)*r/2;
line(lx, ly, rx, ry);
line(lx2, ly2, rx2, ry2);
line(lx, ly, lx2, ly2);
line(rx, ry, rx2, ry2);
if (save) {
rects.add(new lineRect(lx, ly, rx, ry, lx2, ly2, rx2, ry2));
}
}
class lineRect {
float x1, y1, x2, y2, x3, y3, x4, y4;
lineRect(float x1_, float y1_, float x2_, float y2_, float x3_, float y3_, float x4_, float y4_) {
x1 = x1_;
y1 = y1_;
x2 = x2_;
y2 = y2_;
x3 = x3_;
y3 = y3_;
x4 = x4_;
y4 = y4_;
}
void display() {
line(x1, y1, x2, y2);
line(x3, y3, x4, y4);
line(x1, y1, x3, y3);
line(x2, y2, x4, y4);
}
void dup() {
drawRect(300,300,x4,y4,true);
}
}
``````
1 Like

#25 Lerp picture Java mode

(the white bar at the bottom gives you the value from 0 to 1 (stretched to fit across the screen) which is used in lerpColor() function
Source image:

Code
Original
``````PImage img, grayScale;
float a = 0;
void setup() {
println(275*3);
size(825,190);
grayScale.filter(GRAY);
}
void draw() {
background(0);
image(img,0,0);
image(grayScale,img.width*2,0);
a = map(mouseX,0,width,0,1);
for(int i = 0; i < width/3; i++) {
for(int j = 0; j < height; j++) {
color clr = lrp(img.get(i,j),grayScale.get(i,j),a);
pixels[i+j*width+img.width] = clr;
if(i == mouseX && j == mouseY) background(clr);
}
}
updatePixels();
//println(a);
rect(0,183,width*a,7);
}
color lrp(color clr1, color clr2,float v) {
float r = map(v,0,1,red(clr1),red(clr2));
float g = map(v,0,1,green(clr1),green(clr2));
float b = map(v,0,1,blue(clr1),blue(clr2));
//println(red(clr1),green(clr1),blue(clr1),red(clr2),green(clr2),blue(clr2),r,g,b);
return(color(r,g,b));
}
``````
Function
``````PImage lerpImg(PImage img1, PImage img2,float v) {
PGraphics newImg = createGraphics(img1.width,img1.height);
newImg.beginDraw();
for(int i = 0; i < img1.width; i++) for(int j = 0; j < img1.height; j++) newImg.set(i,j,lerpColor(img1.get(i,j),img2.get(i,j),v));
newImg.endDraw();
return(newImg);
}
``````
2 Likes

#26 Square spiral Java mode

Logic

Create a square, create a new square inside of it and multiplying the side of it by m and turning by x radians. It results

Code
``````float r = 600, d = 0, turn = 0.1, m = 0.9;
void setup() {
size(600, 600);
background(0);
stroke(255);
display(300,300,r,m,d,turn,50);
}
void draw() {
}
void display(float x, float y, float r, float m, float d, float trn, int rep) {
for (int i = 0; i < rep; i++) {
for (int j = 0; j < 4; j++) {
float px = x+cos(d+trn*i+j*TWO_PI/4)*r*pow(m, i), py = y+sin(d+trn*i+j*TWO_PI/4)*r*pow(m, i);
float ppx = x+cos(d+trn*(i)+(j+1)*TWO_PI/4)*r*pow(m, i), ppy = y+sin(d+trn*(i)+(j+1)*TWO_PI/4)*r*pow(m, i);
line(px, py, ppx, ppy);
}
}
}

``````

Puts me in mint of a Nautilus sketch I created in JRubyArt:-

``````A = 0.8  # pitch constant
B = 1.4 # radius constant
def settings
size 360, 300
end

def setup
sketch_title 'Approximate Nautilus'
translate 230, 120 # offset x and y from origin
rotate QUARTER_PI + HALF_PI # initial rotation
smooth
background 0
stroke_weight 1
stroke 255
(8..40).each do |z| # draw the radial lines first (it looks nicer)
line(get_x(z * A), get_y(z * A), get_x((z - 8) * A), get_y((z - 8) * A))
end
no_fill
begin_shape # begin spiral 'shell' shape
stroke_weight 4
stroke 255, 0, 0
42.times do |i|
curve_vertex(get_x(i * A), get_y(i * A))
end
end_shape
save_frame(data_path('nautilus.png'))
end

def get_x(theta)
A * cos(theta) * exp((theta / tan(B)))
end

def get_y(theta)
A * sin(theta) * exp((theta / tan(B)))
end

``````

2 Likes

Interesting. It looks far more organic. Altho it is natural since Spiral of theodorus is only used to get the square root of a number through geometry.

I created the original in vanilla processing, in 2009, or possibly earlier for a book on processing (for the Open University), that only ever got self published. At that time I was also exploring Context Free Art and MtnViewMark showed me how to create curved divider lines. I’ve not pursued it in processing, but it looked even more natural.

#27 Rectangle - Circle interception Java mode
(source: Collision Detection)
I made it into a short function. Feel free to use it! I will be using it for Arkanoid game)

Code

ONLY AVAILABLE FOR rectMode(CENTER). Otherwise it won’t work.
(using calculations based on centered rectangle. If you can’t figure it out yourself and really need it, I can make a rectMode(CORNER) version.)

Original
``````int w = 200, h = 300, x = 300, y = 300, r = 25;

void setup() {
size(600,600);
rectMode(CENTER);
}
void draw() {
background(0);
fill( ((overlap(x,y,w,h,mouseX,mouseY,r))? color(0,0,255) : color(255,0,0))  );
rect(x,y,w,h);
fill(255);
circle(mouseX,mouseY,r*2);
}

boolean overlap(float x, float y, float w, float h, float x2, float y2, float r) {
//if(x2 > x - w/2 && x2 < x + w/2 && y2 > y - h/2 && y2 < y + h/2 || dist(x - w/2, y - h/2, x2,y2) < r || dist(x + w/2, y - h/2, x2,y2) < r || dist(x - w/2, y + h/2, x2,y2) < r || dist(x + w/2, y + h/2, x2,y2) < r)  return true;
//if(y2 > y - h/2 && y2 < y + h/2 && x - w/2 - r < x2 && x + w/2 + r > x2) return true;
//if(x2 > x - w/2 && x2 < x + w/2 && y - h/2 - r < y2 && y + h/2 + r > y2) return true;
return (x2 > x - w/2 && x2 < x + w/2 && y2 > y - h/2 && y2 < y + h/2 || dist(x - w/2, y - h/2, x2,y2) < r || dist(x + w/2, y - h/2, x2,y2) < r || dist(x - w/2, y + h/2, x2,y2) < r || dist(x + w/2, y + h/2, x2,y2) < r || y2 > y - h/2 && y2 < y + h/2 && x - w/2 - r < x2 && x + w/2 + r > x2 ||x2 > x - w/2 && x2 < x + w/2 && y - h/2 - r < y2 && y + h/2 + r > y2);
}
``````
Function only
``````boolean overlap(float x, float y, float w, float h, float x2, float y2, float r) {
return (x2 > x - w/2 && x2 < x + w/2 && y2 > y - h/2 && y2 < y + h/2 || dist(x - w/2, y - h/2, x2,y2) < r || dist(x + w/2, y - h/2, x2,y2) < r || dist(x - w/2, y + h/2, x2,y2) < r || dist(x + w/2, y + h/2, x2,y2) < r || y2 > y - h/2 && y2 < y + h/2 && x - w/2 - r < x2 && x + w/2 + r > x2 ||x2 > x - w/2 && x2 < x + w/2 && y - h/2 - r < y2 && y + h/2 + r > y2);
}
``````
1 Like

#28 Micro spirograph Java mode
(based on CodeGuppy Playground)

Code
Original
``````ArrayList<PVector> arm = new ArrayList<PVector>(); //PVector(angle,speed,len);
ArrayList<PVector> pos = new ArrayList<PVector>();
int maxPoints = 650;
//1,   5,  -10 (speed)
//100, 50, 100 (length)
float m = 0.01;
for (int i = 0; i < arms.length; i++) arm.add(arms[i]);
}
void setup() {
size(600, 600);
addArm(new PVector[]{new PVector(0, 1, 100), new PVector(0, 5, 50), new PVector(0, -10, 100)});
}
void draw() {
background(0);
stroke(255);
noFill();
translate(width/2, height/2);
float x = 0, y = 0;
//updating the arms
for (int i = 0; i < arm.size(); i++) {
float nx = x + cos(arm.get(i).x)*arm.get(i).z;
float ny = y + sin(arm.get(i).x)*arm.get(i).z;
line(x, y, nx, ny);
circle(nx, ny, 5);
x = nx;
y = ny;
arm.get(i).x+=arm.get(i).y*m;
}
if (pos.size() > maxPoints && maxPoints != -1) pos.remove(0);
//drawing trail
beginShape();
for (int i = 0; i < pos.size(); i++) {
vertex(pos.get(i).x, pos.get(i).y);
}
endShape();
}

``````
Shorter
``````ArrayList<PVector> arm = new ArrayList<PVector>(), pos = new ArrayList<PVector>();
float m = 0.01, maxPoints = 650, cx = 300, cy = 300;
for (int i = 0; i < arms.length; i++) arm.add(arms[i]);
}
void setup() {
size(600, 600);
addArm(new PVector[]{new PVector(0, 1, 100), new PVector(0, 5, 50), new PVector(0, -10, 100)});
stroke(255);
noFill();
}
void draw() {
background(0);
float x = cx, y = cy;
for (int i = 0; i < arm.size(); i++) {
float nx = x + cos(arm.get(i).x)*arm.get(i).z,ny = y + sin(arm.get(i).x)*arm.get(i).z;
line(x, y, nx, ny);
circle(nx, ny, 5);
x = nx;
y = ny;
arm.get(i).x+=arm.get(i).y*m;
}
if (pos.size() > maxPoints && maxPoints != -1) pos.remove(0);
beginShape();
for (int i = 0; i < pos.size(); i++) vertex(pos.get(i).x, pos.get(i).y);
endShape();
}

``````

#29 Triangle fractal Java mode

Koch curve

Code
Original
``````ArrayList<segment> seg = new ArrayList<segment>();
void setup() {
size(600, 600);
for (float i = 0, cx = 300, cy = 300, a = TWO_PI/3, a2 = a/4, r2 = 200; i < 3; i++) addSeg(cx+cos(a*i+a2)*r2, cy+sin(a*i+a2)*r2, cx+cos(a*(i+1)+a2)*r2, cy+sin(a*(i+1)+a2)*r2);
}
void draw() {
background(0);
for(int i = 0; i < seg.size(); i++) seg.get(i).display();
}
void keyPressed() {
if (key == ' ') for (int i = 0, mm = seg.size(); i < mm; i++) seg.get(i).it();
}
void addSeg(float x1, float y1, float x2, float y2) {
float dir = atan2(y2-y1, x2-x1), r = dist(x1, y1, x2, y2);
}
class segment {
float x1, y1, dir, r;
segment(float x1_, float y1_, float dir_, float r_) {
for (int i = 0; i < 1; i++, x1 = x1_, y1 = y1_, dir = dir_, r = r_);
}
void display() {
stroke(255, 50);
line(x1, y1, x1 + cos(dir)*r, y1 + sin(dir)*r);
}
void it() {
float bx = x1 + cos(dir)*r/3, by = y1 + sin(dir)*r/3, bdir = dir - PI/3, br = r/3, bx2 = bx + cos(bdir)*br, by2 = by + sin(bdir)*br;
seg.add(new segment(x1 + cos(dir)*r/3*2, y1 + sin(dir)*r/3*2, dir, r/3));
r = r/3;
}
}

``````
Explained
``````ArrayList<segment> seg = new ArrayList<segment>(); //array of segments (lines)
void setup() {
size(600, 600);
//creating the 3 starting segments (triangle)
for (float i = 0, cx = 300, cy = 300, a = TWO_PI/3, a2 = a/4, r2 = 200; i < 3; i++) addSeg(cx+cos(a*i+a2)*r2, cy+sin(a*i+a2)*r2, cx+cos(a*(i+1)+a2)*r2, cy+sin(a*(i+1)+a2)*r2);
}
void draw() {
background(0);
//displaying the segments
for(int i = 0; i < seg.size(); i++) seg.get(i).display();
}
void keyPressed() {
//if key == space => trigger .it() method of all current segments (using mm to prevent infinite duplication)
if (key == ' ') for (int i = 0, mm = seg.size(); i < mm; i++) seg.get(i).it();
}
void addSeg(float x1, float y1, float x2, float y2) { //transforming x1,y1,x2,y2 format into x1,y1,dir,r
float dir = atan2(y2-y1, x2-x1), r = dist(x1, y1, x2, y2);
}
class segment {
float x1, y1, dir, r;
segment(float x1_, float y1_, float dir_, float r_) {
for (int i = 0; i < 1; i++, x1 = x1_, y1 = y1_, dir = dir_, r = r_); //using for-loop trick to save on the lines of setting varraibles
}
void display() {
stroke(255, 50);
line(x1, y1, x1 + cos(dir)*r, y1 + sin(dir)*r); //displaying the line in the format x,y,dir,r
}
void it() {
//calculating the next segment varriables
float bx = x1 + cos(dir)*r/3, by = y1 + sin(dir)*r/3, bdir = dir - PI/3, br = r/3, bx2 = bx + cos(bdir)*br, by2 = by + sin(bdir)*br;
seg.add(new segment(x1 + cos(dir)*r/3*2, y1 + sin(dir)*r/3*2, dir, r/3));
r = r/3;
}
}

``````

#30 Sin wave sum Java mode

this is just a beta version. In the near future I plan to add a way to create infinite waves (these are hardcoded). So yea, keep an eye out if you are interested.

(btw, the sin waves move and the purple wave changes with time)

Code
``````float m = 50, m1 = 50, m2 = 25;
float globalOffset = 0;
void setup() {
size(600,600);
}
void draw() {
background(0);
translate(0,height/2);
noFill();
stroke(255,0,0,50);
strokeWeight(3);
beginShape();
for(float i = 0; i < width; i++) vertex(i,sin(i/m1+globalOffset)*m);
endShape();
stroke(0,0,255,50);
beginShape();
for(float i = 0; i < width; i++) vertex(i,sin(i/m2+globalOffset)*m);
endShape();
stroke(255,0,255);
beginShape();
for(float i = 0; i < width; i++) vertex(i,getAvg(sin(i/m1+globalOffset)*m,sin(i/m2+globalOffset)*m));
endShape();
globalOffset += 0.01;
}
float getAvg(float... v) {
float sum = 0;
for(int i = 0; i < v.length; i++) sum+=v[i];
return sum/v.length;
}
``````

here is version 2; It took way less time than expected

V2
``````float globalM = 50;
ArrayList<wave> waves = new ArrayList<wave>();
void setup() {
size(600,600);
//wave(float localM_, float mm_, float offSet_, color clr_, float cy_, float speed_)
}
void draw() {
background(0);
for(int i = 0; i < waves.size(); i++) waves.get(i).update(); //moving the waves
for(int i = 0; i < waves.size(); i++) waves.get(i).display();
displaySum(color(255,0,255),200,1,0,1);
}
void displaySum(color clr, float cy, float mm, int... id) {
stroke(clr);
strokeWeight(3);
noFill();
beginShape();
for(int i = 0; i < width; i++) {
float sum = 0, it = 0;
for(int j = 0; j < id.length; j++) {
sum += waves.get(id[j]).getValue(i);
it++;
}
float avg = sum/it;
vertex(i,avg*mm+cy);
}
endShape();
}
float getAvg(float... v) {
float sum = 0;
for(int i = 0; i < v.length; i++) sum+= v[i];
return sum/v.length;
}
class wave {
float localM, mm, offSet,cy,speed;
color clr;
wave(float localM_, float mm_, float offSet_, color clr_, float cy_, float speed_) {
localM = localM_;
mm = mm_;
offSet = offSet_;
clr = clr_;
cy = cy_;
speed = speed_;
}
void display() {
noFill();
stroke(clr);
strokeWeight(3);
beginShape();
for(float i = 0; i < width; i++) {
vertex(i,cy + sin(offSet + i/localM)*globalM*mm);
}
endShape();
}
void update() {
offSet += speed;
offSet = offSet % TWO_PI;
}
float getValue(float x) {
return(sin(offSet + x/localM)*globalM*mm);
}
}
``````
1 Like

#31 Darts in higher dimensions Java mode
Numberphile video

Instructions:

• on click, set the radius to the length of the blue line
• red line is to show the current radius
• press outside the circle to expand it.
Code
``````float cx = 300, cy = 300, r = 300;
float dir = 0, dst = 0,r2=0;
void setup() {
size(600,600);
}
void draw() {
background(0);
noFill();
dir = atan2(mouseY-cy,mouseX-cx);
dst = dist(cx,cy,mouseX,mouseY);
stroke(255,150);
line(cx,cy,cx+cos(dir)*dst,cy+sin(dir)*dst);
circle(cx,cy,r*2);
r2 = sqrt(abs(r*r-dst*dst));
stroke(0,0,255,150);
line(mouseX-cos(dir+PI/2)*r2, mouseY-sin(dir+PI/2)*r2,mouseX,mouseY);
stroke(255,0,0,150);
line(mouseX,mouseY,mouseX+cos(dir+PI/2)*r, mouseY+sin(dir+PI/2)*r);
text(r,20,20);
}
void mousePressed() {
if(dst > r) {r = dst;}
else {r = r2;}
}
``````

#32 Elliptical pattern Java mode

Code
``````PGraphics bg;
float r = 500, r2m = 0.6, rm = 0.95;
float dir = 0, rot = PI*0.1;
void setup() {
size(600,600);
bg = createGraphics(width,height);
bg.beginDraw();
bg.background(0);
bg.endDraw();
}
void draw() {
background(0);
bg.beginDraw();
bg.stroke(255);
bg.noFill();
bg.push();
bg.translate(width/2,height/2);
bg.rotate(dir);
bg.ellipse(0,0,r,r*r2m);
bg.pop();
bg.endDraw();
background(bg);
dir+=rot;
r*=rm;
}
``````

#33 Angular drawer Java mode

Features:

• draw - left mouse button
• int n - set the number of copies (examples have n = 12)
• guide lines - toggle with middle mouse button
• clear - right mouse button

Logic

Create a simple drawing program `line(pmouseX,pmouseY,mouseX,mouseY)`, but turn it into cartesian coordinates. After it, create a similar thing for the n other lines and arrange them into a circle

Code
``````PGraphics bg;
int n = 12;
float cx = 300, cy = 300;
boolean displayLines = true;
void setup() {
size(600, 600);
bg = createGraphics(width, height);
}
void draw() {
background(0);
stroke(255, 50);
float rot = atan2(mouseY-cy, mouseX-cx), prot = atan2(pmouseY-cy, pmouseX-cx), a = TWO_PI/n, r=dist(cx, cy, mouseX, mouseY), pr=dist(cx, cy, pmouseX, pmouseY);
bg.beginDraw();
bg.stroke(255);
if (mousePressed && mouseButton == LEFT) for (int i = 0; i < n; i++) bg.line(cx+cos(prot+a*i)*pr, cy+sin(prot+a*i)*pr, cx+cos(rot+a*i)*r, cy+sin(rot+a*i)*r);
bg.endDraw();
image(bg, 0, 0);
if (displayLines) for (int i = 0; i < n; i++) line(cx, cy, cx+cos(rot+a*i)*r, cy+sin(rot+a*i)*r);
}
void mousePressed() {
if (mouseButton == RIGHT) bg.clear();
if (mouseButton == CENTER) displayLines = !displayLines;
}

``````
1 Like