Grace Cha – Project 09- Portrait

sketc

//Grace Cha
//Section C
//heajinc
//Project 9 

var underlyingImage;

function preload() {
    var myImageURL = "http://i.imgur.com/ntVrOBL.jpg?1";
    underlyingImage = loadImage(myImageURL);
}

function setup() {
    createCanvas(400, 410);
    background(252);
    underlyingImage.loadPixels();


    vertX = random(0, width); //Picks a point randomly on top
    vertY = 0; //at the top
    horizX = 0; //Starts randomly
    horizY = random(0, height);//at the left side
    
}

function draw() {

    verticalGrace();
    horizontalC();
}
function verticalGrace() {
  var ix = constrain(floor(vertX), 0, width + 100); //set max and min of ix
  var iy = constrain(floor(vertY), 0, height + 100); //set max and min of iy
  var theColorAtLocationXY = underlyingImage.get(ix, iy); //Obtains pixel


  fill(theColorAtLocationXY); //Fill with pixel color at ix, iy
  
  textSize(10);
  
  
  noStroke();
  text("CHA", vertX, vertY); 
  
  vertY += 10; // move at a rate of 10 
  
  	if (vertY > height) { //If the GRACE hit bottom of canvas
  		vertY = 0; 	//resets the image back to the top
  		vertX = random(0, width ); //Relocate the x-coordinate of the rect
  	}
}

function horizontalC() {
    var ix = constrain(floor(vertX), 0, width-1); //set max and min of ix
    var iy = constrain(floor(vertY), 0, height-1); //set max and min of iy
    var theColorAtLocationXY = underlyingImage.get(ix, iy); //Obtains pixel

  
    fill(theColorAtLocationXY); 
    textSize(10);
    textStyle(BOLD);
    text("C",horizX, horizY ); 
  
    horizX += 10;
    if (horizX > width) {
  	    horizX = 0;
  	    horizY = random(0, height);
  	}	   
}

I played around with the idea of spelling my name out to display my face.  I tried using “GRACE” but the word was too long that it distorted the image, so I used my last name “CHA”.  To add contrast to the longer word “CHA” I decided to use one letter “C” to represent the horizontal rows.