Rotate the rectangle by 3 degress while shrinking down.

[aashimgarg]

the rectangle should rotate by three degrees while it gets scaled down .

[kk77777]

the rectangle should rotate by three degrees while it gets scaled down.

Want to work on this.

[aashimgarg]

yes you can!

[anuratb]

Can I address the issue

[YashVadhadiya]

HTML

<canvas id="canvas" width="400" height="400"></canvas>

JS

`var earth = new Image();
function init() {
earth.src = 'https://mdn.mozillademos.org/files/1429/Canvas_earth.png';
window.requestAnimationFrame(draw);
}
function draw() {
var ctx = document.getElementById('canvas').getContext('2d');

ctx.globalCompositeOperation = 'destination-over';
ctx.clearRect(0, 0, 300, 300);
ctx.fillStyle = 'rgba(0, 0, 0, 0.4)';
ctx.strokeStyle = 'rgba(0, 153, 255, 0.4)';
ctx.save();
ctx.translate(150, 150);

// Earth
var time = new Date();
ctx.rotate(((2 * Math.PI) / 60) * time.getSeconds() + ((2 * Math.PI) / 60000) * time.getMilliseconds());
ctx.translate(105, 0);

ctx.drawImage(earth, -12, -12);
ctx.restore();
ctx.restore();
ctx.beginPath();
ctx.arc(150, 150, 105, 0, Math.PI * 2, false); // Earth orbit
ctx.stroke();

window.requestAnimationFrame(draw);
}

init();`

May it will help.