Forked from nataliefreed/imageFilterStartingPoint.js
Last active
January 25, 2018 18:34
-
-
Save lizzybrooks/6c80066ef5795ac75678ff9399ec17af to your computer and use it in GitHub Desktop.
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
//baby pic used in class example is by ms. brooks. cite url for pics found online | |
var img; | |
//preload will load before setup runs | |
function preload() { | |
//this relative file path starts in the same folder as your sketch. | |
//In other words, in this example, make a folder called images in the same | |
//folder as your sketch file (sketch.js) and then put the image file ("kittens.jpg") | |
//inside of that. | |
img = loadImage("images/jomy.jpg"); | |
} | |
function setup() { | |
createCanvas(img.width, img.height); | |
image(img, 0, 0); //draw the image to the canvas | |
console.log("Image width: " + img.width + " height: " + img.height); | |
//one of the built-in filters to try out for inspiration! More at: https://p5js.org/reference/#/p5/filter | |
//uncomment to test | |
//filter(POSTERIZE, 5); | |
//change pixels, draw a blue stripe | |
loadPixels(); | |
for(var i=4*640*100;i<4*640*200;i+=4) { | |
pixels[i] = 0; //red | |
pixels[i+1] = 0; //green | |
pixels[i+2] = 255; //blue | |
pixels[i+3] = 255; //alpha (transparency - works with PNGs, not JPGs) | |
} | |
updatePixels(); | |
//change tint of pixels in a stripe by modifying the red channel | |
loadPixels(); | |
for(var i=4*640*300;i<4*640*400;i+=4) { | |
pixels[i] = pixels[i]-50; //red | |
} | |
updatePixels(); | |
} | |
function draw() { | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment