I was making some circles in the HTML Canvas element and the circles were so smooth. In a sense that you cant see any vertices.

I normally work in unity and I you make a shape in 3d you most of the time see vertices (aka not a perfectly smooth circle). It only really looks smooth if you crank the vertices count up to something like 100 - 150 But this would be highly inefficient to render.

So now my question: How does HTML canvas manage to draw such smooth circles? Is this A: with a very high vertices count, or B: some other magic is used if so how do they do it?

Let me know if anything is unclear or needs extra information.

  • $\begingroup$ You can draw a circle in 2D without representing it through triangles - see Bresenham's algorithm for example. $\endgroup$
    – lightxbulb
    Mar 23, 2020 at 9:55
  • $\begingroup$ Wouldn't that require you to rasterise it pixel-by-pixel, in HTML ? (Sorry if that sounds ignorant, I don't know HTML) $\endgroup$
    – PaulHK
    Mar 27, 2020 at 7:23


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.