Good evening.
Who can explain why, after canvas.translate(0, -canvasRadius * 0.8); we need to use canvas.rotate(-ang)?
I assume this is to "return" to the original 0 position. But it is not clear what the lines after it are for.
for (num = 1; num < 13; num++) {
ang = (num * Math.PI) / 6;
canvas.rotate(ang);
canvas.translate(0, -canvasRadius * 0.8);
canvas.rotate(-ang);
canvas.fillText(num.toString(), 0, 0);
canvas.rotate(ang);
canvas.translate(0, canvasRadius * 0.8);
canvas.rotate(-ang);
}
Looks like it rotates canvas so that the subsequent translate is at the correct point for the number. A rotation in the opposite direction makes sure that the subsequent fillText is the right way up.
The remaining rotations and translate reverse the previous operations and relocate back to the origin ready for the next iteration.