digitalfruit/limejs — pull request #125 by aurhe (2014-02-24 10:46:30+00:00)
Title: Problem with circles rendered in webkit canvas

For quite a while I have been noticing that the borders of circles are rendered with a lot of imperfections when the canvas renderer is used in webkit based browsers:
![1](https://f.cloud.github.com/assets/1474080/2162915/40aa0702-94d8-11e3-95ae-f636387f7dfa.png)
Our games have a lot of circular elements, and the quality of them is quite noticeably degraded when rendered with canvas. And it is because of this that we have been avoiding using it.

But I have now decided to investigate why this is happening and found that it is the clip method of the webkit implementation of canvas that is causing this. So I have made a small change to draw circles using the fill method and it corrected it for most fill types except images.
![2](https://f.cloud.github.com/assets/1474080/2162940/7d4350d8-94d8-11e3-8664-6c172e9961b0.png)
Those changes are available here: https://github.com/aurhe/limejs/commit/3cd8ccb5e54422667643a2dc0b3befe1f44ae13e but still lack proper testing, and I still have not found a way for drawing rounded images in canvas without using the clip method.

So my question is: Should the drawing method be changed to this only for circles and roundrects? Or will we continue waiting for this to be corrected in webkit?

I have been seeing this problem in webkit based browsers for a while and I personally wouldn't count that it will be fixed anytime soon.