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

在webstroe有圆显示,在sublime就没有

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>时钟</title>

</head>

<style type="text/css">

div{text-align: center;margin-top: 250px: }

clock{border:1px solid #ccc;}

</style>

<body>

<div>

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

</div>

<script type="text/javascript" >

var dom = document.getElementById('clock')

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

var height = ctx.canvas.height;

var width = ctx.canvas.width;

var r = width/2;

function draw(){

ctx.translate(r,r);

ctx.beginPath();

ctx.lineWidth = 10;

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

ctx.stroke();

}

draw();

</script>

</body>

</html>


提问者:宝慕林2917688 2016-10-26 16:15

个回答

  • 慕圣2809978
    2016-10-26 19:29:39

    将ctx.arc(0,0,r,0,2*Math.PI,false)改成ctx.arc(0,0, r - 5,0,2*Math.PI,false)就可以完整显示圆