                        课程
                    
                        /前端开发
                        
                            /Html5
                        
                        /Canvas绘图详解

哪里有问题，显示不出来？

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title>弯月封装</title>
   </head>
   <body>
       <canvas id="canvas" style="display: block;border: 1px solid #ddd; margin: 50px auto;"></canvas>
       <script type="text/javascript">
           window.onload = function(){
               var canvas = document.getElementById("canvas");
               canvas.width = 800;
               canvas.height = 800 ;

               var cxt = canvas.getContext("2d");

               fillMoon(cxt,2,400,400,300,0);
           }
           function fillMoon(cxt , d , x , y , R , rot , /*optional*/ fillColor ){
               cxt.save();
               cxt.translate(x , y);
               cxt.rotate(rot * Math.PI / 180);
               cxt.scale(R , R);
               pathMoon( cxt , d );
               cxt.fillStyle = fillColor || "#fb5";
               cxt.fill();
               cxt.restore();
           }

           function pathMoon(cxt,d){
               cxt.beginPath();
               cxt.arc(0,0,1,0.5*Math.PI, 1.5*Math.PI ,true);
               ct.MoveTo(0,-1);
               cxt.arcTo(d,0,0,1,dis(0,-1,d,0)/d);
               cxt.closePath();
           }

           function dis(x1,y1,x2,y2){
               return Math.sqrt((x1-x2)*(x1-x2) + (y1-y2) *(y1-y2));
           }
       </script>
   </body>
</html>