Answer the question
In order to leave comments, you need to log in
How to rotate image inside canvas relative to mouse position?
var blob,blobs=[],img,angle=0;
function preload() {
img = loadImage('static/img/maps/first.png');
player = loadImage('static/img/heroes/first.png');
}
function setup() {
createCanvas(windowWidth,windowHeight);
blob = new Blob(width/2-25, height/2-25, 50);
for(var i = 0; i < 50; i++) {
blobs[i] = new Blob(random(width),random(height),16);
}
angleMode(DEGREES);
}
function draw() {
background(0);
translate(width/2-blob.pos.x, height/2-blob.pos.y);
if(blob.pos.x > img.width-blob.r) blob.pos.x = img.width-blob.r;
if(blob.pos.y > img.height-blob.r) blob.pos.y = img.height-blob.r;
if(blob.pos.x < 0+blob.r) blob.pos.x = 0+blob.r;
if(blob.pos.y < 0+blob.r) blob.pos.y = 0+blob.r;
image(img, 0, 0);
pop();
translate(width/2, height/2);
rotate(angle);
translate(-width/2, -height/2);
blob.show();
push();
for(var i = 0; i < blobs.length; i++) {
//blobs[i].show();
}
blob.update();
angle = mouseX/1000*10;
}
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question