html - 画布中的自定义形状？

Question

有没有办法在 html5 画布中使用“贝塞尔曲线”或“二次曲线”来创建形状。或者有什么方法可以在画布中绘制多边形

Answer 1

对于多边形，您可以使用以下内容（其中 ctx 是画布的 getContext('2d')）：

ctx.fillStyle=*hex code of the color you want it to be";
ctx.beginPath();
ctx.moveTo(x1,y1);
ctx.lineTo(x2,y2);
ctx.lineTo(x3,y3);
*add more points if needed using a lineTo(x,y) for each of your points*
ctx.closePath();
ctx.fill();

如果您想要一个描边多边形，请使用 ctx.strokeStyle 和 ctx.stroke() 而不是 ctx.fillStyle 和 ctx.fill()

Answer 2

当然可以，你至少有：

• 二次曲线到
• 贝塞尔曲线到

看看这个示例代码：

http://www.html5canvastutorials.com/labs/html5-canvas-playing-card-suits/