Javascript 如何删除椭圆之间的直线连接？JS帆布

因此，我试图在画布上用Javascript绘制一张脸，微笑是用椭圆（x，y，rX，rY，rot，start，end）绘制的。我关闭了路径（

closePath（）；

），然后用笔划命令（

stroke（）；

）.这画的是椭圆，看起来像一个半圆。但这也画了一个连接半圆两端的笔划，我不想要。它看起来像这样：

var c=document.createElement（'canvas'）；
var ctx=c.getContext（'2d'）；
var w=500；
var h=300；
window.onload=函数（）{
c、 style.backgroundColor='#aaa'；
c、 宽度=w；
c、 高度=h；
c、 tabIndex='1'；
c、 style.outline='none'；
c、 style.display='block'；
c、 style.margin='0 auto'；
c、 style.position='相对'；
c、 style.top='50px'；
document.body.style.margin='0'；
文件.正文.附件（c）；
}
setInterval（函数（）{
ctx.clearRect（0，0，w，h）；
ctx.beginPath（）；
椭圆（w/2，h/2，30，35，0，0，2*Math.PI）；
ctx.closePath（）；
ctx.fillStyle='#cf9454'；
ctx.fill（）；
ctx.stroke（）；
ctx.beginPath（）；
椭圆（w/2-10，h/2-10，2，2，0，0，2*Math.PI）；
ctx.移动到（w/2+10，h/2-10）；
椭圆（w/2+10，h/2-10，2，2，0，0，2*Math.PI）；
ctx.closePath（）；
ctx.stroke（）；
ctx.fillStyle='#000'；
ctx.fill（）；
ctx.beginPath（）；
ctx.椭圆（w/2，h/2+10,16,12,0,0,1*数学圆周率）；
ctx.closePath（）；
ctx.stroke（）；
}，30）；

您只需省略最后一个

closePath（）调用即可。其意图如所述：

Canvas 2D API的
CanvasRenderingContext2D.closePath（）
方法尝试添加一条从当前点到当前子路径起点的直线

它有效地将这条直线添加到“嘴”形状上。因此，只需忽略这一点：


var c=document.createElement（'canvas'）；
var ctx=c.getContext（'2d'）；
var w=500；
var h=140；//简化为使笑脸出现在代码段区域内
window.onload=函数（）{
c、 宽度=w；
c、 高度=h；
c、 tabIndex='1'；
c、 style.backgroundColor='#aaa'；
c、 style.outline='none'；
c、 style.display='block'；
c、 style.margin='0 auto'；
c、 style.position='相对'；
c、 style.top='50px'；
document.body.style.margin='0'；
文件.正文.附件（c）；
}
setInterval（函数（）{
ctx.clearRect（0，0，w，h）；
ctx.beginPath（）；
椭圆（w/2，h/2，30，35，0，0，2*Math.PI）；
ctx.closePath（）；
ctx.fillStyle='#cf9454'；
ctx.fill（）；
ctx.stroke（）；
ctx.beginPath（）；
椭圆（w/2-10，h/2-10，2，2，0，0，2*Math.PI）；
ctx.移动到（w/2+10，h/2-10）；
椭圆（w/2+10，h/2-10，2，2，0，0，2*Math.PI）；
ctx.closePath（）；
ctx.stroke（）；
ctx.fillStyle='#000'；
ctx.fill（）；
ctx.beginPath（）；
ctx.椭圆（w/2，h/2+10,16,12,0,0,1*数学圆周率）；
//ctx.closePath（）；//您只需省略最后一个
closePath（）
调用即可。其意图如所述：

Canvas 2D API的
CanvasRenderingContext2D.closePath（）
方法尝试添加一条从当前点到当前子路径起点的直线

它有效地将这条直线添加到“嘴”形状上。因此，只需忽略这一点：


var c=document.createElement（'canvas'）；
var ctx=c.getContext（'2d'）；
var w=500；
var h=140；//简化为使笑脸出现在代码段区域内
window.onload=函数（）{
c、 宽度=w；
c、 高度=h；
c、 tabIndex='1'；
c、 style.backgroundColor='#aaa'；
c、 style.outline='none'；
c、 style.display='block'；
c、 style.margin='0 auto'；
c、 style.position='相对'；
c、 style.top='50px'；
document.body.style.margin='0'；
文件.正文.附件（c）；
}
setInterval（函数（）{
ctx.clearRect（0，0，w，h）；
ctx.beginPath（）；
椭圆（w/2，h/2，30，35，0，0，2*Math.PI）；
ctx.closePath（）；
ctx.fillStyle='#cf9454'；
ctx.fill（）；
ctx.stroke（）；
ctx.beginPath（）；
椭圆（w/2-10，h/2-10，2，2，0，0，2*Math.PI）；
ctx.移动到（w/2+10，h/2-10）；
椭圆（w/2+10，h/2-10，2，2，0，0，2*Math.PI）；
ctx.closePath（）；
ctx.stroke（）；
ctx.fillStyle='#000'；
ctx.fill（）；
ctx.beginPath（）；
ctx.椭圆（w/2，h/2+10,16,12,0,0,1*数学圆周率）；
//ctx.closePath（）//