大佬教程收集整理的这篇文章主要介绍了Canvas绘制贝塞尔曲线，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<!DOCTYPE html>
<html>
<head lang="en">
<Meta charset="UTF-8">
<title></title>
</head>
<body>
<canvas id="test" width="1200px" height="600px" style="BACkground-color: white"></canvas>
<script type="text/javascript">
var c=document.getElementById("test");
var ctx=c.getContext("2d");
var state = 0;
var x_ = 30;
var y = 300;
var r = 150;
var ctrl_y = 90;
seTinterval("drawEnemy(x_)",200);
function drawEnemy(X)
{
ctx.clearRect(0,1200,600);
ctx.beginPath();
if(state == 0)
{
for(var i = 0;i<5;i++)
{
if(i%2==0)
{
x = x+r;
ctx.moveTo(x,y);
ctx.bezierCurveTo(x,y+ctrl_y,x+r,y);
}
else
{
x = x+r;
ctx.moveTo(x,y-ctrl_y,y);
}
}
state = 1;
}
else
{
for(i = 0;i<5;i++)
{
if(i%2!=0)
{
x = x+r;
ctx.moveTo(x,y);
}
}
state = 0;
}
ctx.stroke();
}
</script>
</body>
</html>
运行截图：
以上是大佬教程为你收集整理的Canvas绘制贝塞尔曲线全部内容，希望文章能够帮你解决Canvas绘制贝塞尔曲线所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。