<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<canvas id="myCanvas" width="500" height="500" style="border:1px solid red"></canvas>
</body>
</html>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
//重置画布中心点
ctx.translate(c.width/2,c.height/2);
//设置圆半径
var r=50
ctx.beginPath();
for(var i=0;i<360;i++)
{
var x,y,arc;
arc=i*(Math.PI*2/360)
y=Math.sin(arc)*r;
x=Math.cos(arc)*r;
ctx.lineTo(x,y);
//console.log(x+"========="+y)
}
ctx.strokeStyle="green";
ctx.stroke();
</script>