小编JF-*_*chs的帖子

如何在画布中填充二次曲线?

是否可以填充二次曲线?

\n\n

我是画布新手,我想填充我在 context.quadraticCurveTo() 中绘制的上部部分的颜色,但是当我尝试 context.fill() 时,它没有填充我的预期部分。我想填充画布的上半部分,该部分被笔划分开。

\n\n

请参阅随附的片段。

\n\n

\r\n
\r\n
const canvas = document.getElementById(\'canvas\');\r\nconst ctx = canvas.getContext(\'2d\');\r\nconst ch = canvas.height;\r\nconst cw = canvas.width;\r\n\r\n// Quadratic B\xc3\xa9zier curve\r\nctx.beginPath();\r\nctx.moveTo(0, 60);\r\nctx.quadraticCurveTo(ch, 0, cw, 35);\r\nctx.stroke();\r\nctx.fill();
Run Code Online (Sandbox Code Playgroud)\r\n
#canvas {\r\n  border: 1px solid;\r\n}
Run Code Online (Sandbox Code Playgroud)\r\n
<canvas id="canvas"></canvas>
Run Code Online (Sandbox Code Playgroud)\r\n
\r\n
\r\n

\n

html javascript css canvas html5-canvas

0
推荐指数
1
解决办法
1792
查看次数

标签 统计

canvas ×1

css ×1

html ×1

html5-canvas ×1

javascript ×1