码迷,mamicode.com
首页 > 其他好文 > 详细

arcTo 画 狐行

时间:2016-05-11 10:46:43      阅读:130      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE HTML>
<head>
<meta charset = "utf-8">
<title>starGirl</title>
<style type="text/css">
#canvas{
border:1px solid #eee ;
display:block;
background-color: #B36666;
margin: 20px auto;
}
</style>
</head>
<body>
<div>
<canvas id = "canvas" width = "800px" height = "600px"></canvas>
</div>
<script type = "text/javascript" >
window.onload=function(){
var context = document.getElementById(‘canvas‘).getContext(‘2d‘)
//设置高宽,不建议在css里面设置,因为会不准确
canvas.height=800;
canvas.width=800;
arcToText(context,150,100,650,100,400,650,300);
function arcToText(context,x0,y0,x1,y1,x2,y2,R){
context.beginPath();
context.moveTo(x0,y0);
context.arcTo(x1,y1,x2,y2,R);

context.lineWidth=6;
context.strokeStyle=‘red‘;
context.stroke();

context.beginPath();
context.moveTo(x0,y0);
context.lineTo(x1,y1);
context.lineTo(x2,y2);

context.lineWidth=3;
context.strokeStyle=‘yellow‘;
context.stroke();
}
}
</script>
</body>
</html>

arcTo 画 狐行

标签:

原文地址:http://www.cnblogs.com/vs1435/p/5480892.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!