> Though you don't need 4 arcTo in order to make a rounded rect, you can use bezier instead (we do)
I'm pretty new to this - do you have an example of using bezier? And why is it preferred over arcTo?
I'm pretty new to this - do you have an example of using bezier? And why is it preferred over arcTo?
The benefit of doing this for quarter-circle arcs directly may be that you save a bunch of trigonometry that otherwise has to happen (cf. the Pomax link).
function roundedRect(ctx, x, y, width, height, radius) {
ctx.beginPath();
ctx.moveTo(x, y + radius);
ctx.arcTo(x, y + height, x + radius, y + height, radius);
ctx.arcTo(x + width, y + height, x + width, y + height - radius, radius);
ctx.arcTo(x + width, y, x + width - radius, y, radius);
ctx.arcTo(x, y, x, y + radius, radius);
ctx.stroke();
}