LL_liiiii 2017-08-19 05:42 采纳率: 0%
浏览 3622

用<canvas>标签绘制图形浏览器显示不出来

代码如下：

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
    <title></title>
    <script type="application/javascript">
        function draw(){
            var canvas=document.getElementById('canvas');
            if(canvas.getContext){
                var ctx=canvas.getContext("2d");
                for(var i=0;i<2;i++){
                    for(var j=0;j<3;j++){
                        ctx.beginPath();
                        var x=10+j*30;
                        var y=10+i*30;
                        var radius=10;
                        var stratAngle=0;
                        var endAngle=Math.PI+(Math.PI*j)/2;
                        var anticlockwise=false;
                        ctx.arc(x,y,raidus,stratAngle,endAngle,anticlockwise);
                        ctx.stroke();
                    }               
                }
            }
        }


    </script>
</head>
<body onload="draw()">
<canvas id="canvas" width="200" height="200"></canvas>
</body>
</html>

我还找了另一个例子，照着敲的也显示不出来

  • 写回答

1条回答 默认 最新

  • Go 旅城通票 2017-08-19 05:59
    关注

    raidus没有定义

    
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script>
        function draw(){
            var canvas = document.getElementById('canvas');
            var raidus=20///////////////////
            if(canvas.getContext){
                var ctx=canvas.getContext("2d");
                for(var i=0;i<2;i++){
                    for(var j=0;j<3;j++){
                        ctx.beginPath();
                        var x=10+j*30;
                        var y=10+i*30;
                        var radius=10;
                        var stratAngle=0;
                        var endAngle=Math.PI+(Math.PI*j)/2;
                        var anticlockwise=false;
                        ctx.arc(x,y,raidus,stratAngle,endAngle,anticlockwise);
                        ctx.stroke();
                    }
                }
            }
        }


    </script>
</head>
<body onload="draw()">
    <canvas id="canvas" width="200" height="200"></canvas>
</body>
</html>
    评论

报告相同问题？

悬赏问题

  • ¥15 drone 推送镜像时候 purge: true 推送完毕后没有删除对应的镜像,手动拷贝到服务器执行结果正确在样才能让指令自动执行成功删除对应镜像，如何解决？
  • ¥15 求daily translation（DT）偏差订正方法的代码
  • ¥15 js调用html页面需要隐藏某个按钮
  • ¥15 ads仿真结果在圆图上是怎么读数的
  • ¥20 Cotex M3的调试和程序执行方式是什么样的？
  • ¥20 java项目连接sqlserver时报ssl相关错误
  • ¥15 一道python难题3
  • ¥15 牛顿斯科特系数表表示
  • ¥15 arduino 步进电机
  • ¥20 程序进入HardFault_Handler