Image Rotating Around Mouse

PImage dog;
float rotateVal = 0.0;

void setup () {
size(800,800);
strokeCap(SQUARE);
dog = loadImage("puppy.png");
imageMode(CENTER);
}
void draw() {
rotateVal += .02;
background(255);

pushMatrix();
translate(mouseX, mouseY);
rotate(rotateVal);
image(dog, 175, 0);
popMatrix();

ellipse(400,400, 100,100);
}

Code

Video Demonstration

This code rotates the image of the puppy around the mouse. As can be seen from the video, the dog rotates around the circle. The purpose of the circle is to show how the dog rotates around the mouse in a circular motion. As the mouse moves, the dog moves along with it, still rotating. In order to insert an image into the program, I found a png image online and added the file into the sketch. Then all I had to do was write the title of the file in the correct line. The code uses new functions that we haven’t played with until now. These functions include strokeCap(), rotate(), loadImage(), imageMode() and ellipse(). By increasing or decreasing .02 in rotateVal += .02, you can change the speed that the dog turns.

(click the functions underlined to learn more about them)

Image Rotating Around Mouse

Code

Video Demonstration

Functions Analysed