问答详情
源自：3-1 Canvas 时钟外边框圆

麻烦问下为啥只出现方框不出现圆？

<!doctype html>

<html>


<head>

    <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1">

    <title>Canvas</title>

    <style type="text/css">

    div {

        text-align: center;

        margin-top: 250px;

    }


    #clock {

        border: 1px solid #ccc;

    }

    </style>

</head>


<body>

    <div>

        <canvas id="clock" height="280px" width="280px"></canvas>

    </div>

    <script type="text/javascript">

    var dom = document.getElementsById('clock');

    var ctx = dom.getContext('2d');

    var width = ctx.canvas.width;

    var height = ctx.canvas.height;

    var r = width / 2;


    function drawBackground() {

        ctx.translate(r, r);

        ctx.beginPath();

        ctx.lineWidth = 10;

        ctx.arc(0, 0, r - 5, 0, 2 * Math.PI, false);

        ctx.stroke();

    }


    drawBackground();

    </script>

</body>


</html>


提问者：Jack_Lan 2018-05-30 15:42

个回答

  • qq_慕设计5352929
    2019-12-18 19:32:14

    宽度好像可以直接写 var width = canvas.width;  不用那么麻烦

    0
  • 一无所知的小黑华
    2019-07-21 10:27:19

      var dom = document.getElementsById('clock');

    是getElementById,打多一个S


    0
  • Jack_Lan
    2018-05-30 15:52:05

    getElementsById 应该是getElementById

    0