Upload an image

Upload a media file is to easy to do you just have to create a variable (img) and a function preload().In the function preload() we will load the image, by using img= loadImage(). Then when we want to put the image somewhere we will put the variable img.

In this example, much of this code is the same as the interaction with mouse. We only add an image in the background at the screen.


  var img;
var d = 100;
function setup(){
createCanvas(1250, 500);
}
function preload(){
  img= loadImage('/images/image.jpg')
}
function draw(){
//clear background
	background(img);
//draw face
	fill('#FCD0B4');
	ellipse(mouseX,mouseY,d,d);
//draw eyes
	fill(0,0,255);
	ellipse(mouseX-d/6,mouseY-d/7,d/5,d/5);
	ellipse(mouseX+d/6,mouseY-d/7,d/5,d/5);
	fill(255,0,0,100);
	triangle(mouseX, mouseY-d/20, mouseX+d/12, mouseY+d/7, mouseX-d/12, mouseY+d/7);

//draw mouth
	fill(255,0,0);
	arc(mouseX,mouseY+d/4,d/2.5,d/4.5,0,PI,CHORD);
}