zhuoyinl-project 09

13001311_257203241292906_3846527802288812822_n
This is the original photo.

%e5%be%ae%e4%bf%a1%e6%88%aa%e5%9b%be_20161028102108
I relate the mouse movement to the area that is showing the photos

%e5%be%ae%e4%bf%a1%e6%88%aa%e5%9b%be_20161027131510

sketch

//Zhuoying Lin
//zhuoyinl@andrew.cmu.edu
//section a 
//project 09

var underlyingImage;

function preload() {
	var image = "https://scontent-dft4-2.xx.fbcdn.net/v/t1.0-9/14572982_354839081529321_6987009359279715749_n.jpg?oh=14016ac2f97e3340a7fb671665b39d1a&oe=589F4AC3";
	underlyingImage = loadImage(image);

}

function setup() {
	createCanvas(650,650);
	background(0);
	underlyingImage.loadPixels();
	frameRate(1000);
	
}

function draw() {
	var px = random(width);
	var py = random(height);
	var ix = constrain(floor(px),0,width-1);
	var iy = constrain(floor(py),0,height-1);

	var mousecol = underlyingImage.get(mouseX, mouseY);
	//get color fo the tranangle
	fill(mousecol);
	noStroke();
	triangle(mouseX,mouseY,pmouseX,pmouseY,mouseX-random(-1,1),pmouseY+random(-1,1));
	//make trangle size related to velocity of mouse movement
	

}

Leave a Reply