Comentário: compartilhe códigos de círculo simples em html5, consulte a eles
<! Doctype html> <head>
<meta charset = utf-8>
<title> HTML5 Círculo de desenho </ititle>
<script src = "<a href =" http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "> </script"> "> </script </a >>
</head>
<Cript>
$ (document) .ready (function () {
var c = document.getElementById ("drawbox");
var drak = c.getContext ("2d"); // Obtenha uma referência ao conteúdo 2D e chame a API de desenho </p> <p> draw.fillstyle = "vermelho"; // color
draw.beginpath (); // extrair de um novo
draw.arc (50,50,50,0, math.pi*2, verdadeiro); // Centro x coordenada | Centro y Coordenada | diâmetro | Iniciar | pi é pi, math.pi*2 é o círculo de desenho | true é a direção do sentido horário: no sentido anti -horário, 0 é horário, no sentido horário,
draw.ClosePath (); // END
draw.fill ();
})
</script>
</body>
<lVAs> </canvas>
</body>
</html>
Diagrama de reprodução