When drawing on your HTML canvas in JavaScript, you aren't restricted to straight lines. Using curves and arcs you are able to create smooth curved lines.
For some reason; I was unable to get the canvas to look correctly on my retina screen without specifying the width, height attributes along with explicitly specifying the uniques in CSS as well--a convention I'm usually used to with my past experiences with Canvas.
I then do the following to get a non-cropped result: w/ Chrome and Safari:
if('devicePixelRatio' in window &&
context.webkitBackingStorePixelRatio < 2) {
canvas.setAttribute('width', 600 * devicePixelRatio)
canvas.setAttribute('height', 600 * devicePixelRatio)
context.transform(devicePixelRatio,0,0,devicePixelRatio,0,0)
}
done