Last active
September 18, 2016 09:14
-
-
Save ale2x72/84454217a9e3b790fa4c to your computer and use it in GitHub Desktop.
imgGrid - Processing sketch to add a pixel grid over an existing raster image
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
image processing sketch | |
puts a pixel grid of variable size over a picture | |
code for Processing 3 | |
code © Alessio Erioli - Co-de-iT | |
Keys: | |
spacebar - toggles picture | |
2-5 - changes grid spacing | |
i, I - saves a screenshot as "pixelated.png" | |
*/ | |
PImage img; | |
int step =3; | |
int im = 0; | |
float tr = 90; | |
void setup() { | |
size(100,100,P2D); | |
surface.setResizable(true); | |
img = loadImage("img1.jpg"); // make sure you have 2 image files named img1.jpg and img2.jpg in your sketch data folder | |
surface.setSize(img.width, img.height); | |
smooth(); | |
fill(255, tr); | |
stroke(255, tr); | |
strokeWeight(1); | |
} | |
void draw() { | |
background(0); | |
image(img,0,0); | |
for (int i=0; i<width; i=i+step) { | |
for (int j=0; j<height; j=j+step) { | |
point(i, j); | |
} | |
} | |
} | |
void keyPressed() { | |
if (key == 'i'|| key == 'I') { | |
saveFrame("images/pixelated.png"); | |
} | |
switch(key) { | |
case '2': | |
step = 2; | |
break; | |
case '3': | |
step = 3; | |
break; | |
case '4': | |
step = 4; | |
break; | |
case '5': | |
step = 5; | |
break; | |
case ' ': | |
im++; | |
load(im); | |
break; | |
} | |
} | |
void load(int im) { | |
if (im%2==0) { | |
img = loadImage("img1.jpg"); | |
surface.setSize(img.width, img.height); | |
smooth(); | |
} | |
else { | |
img = loadImage("img2.jpg"); | |
surface.setSize(img.width, img.height); | |
smooth(); | |
} | |
} | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment