如何使用canvas画一个S型曲线

以下是使用canvas画一个S型曲线的代码示例：

<canvas id="myCanvas"></canvas>

<script>
  var canvas = document.getElementById("myCanvas");
  var ctx = canvas.getContext("2d");

  ctx.beginPath();
  ctx.lineWidth = 2;
  ctx.strokeStyle = "#000000";

  var startX = 50;
  var startY = 100;
  var endX = 250;
  var endY = 100;
  var cp1X = 125;
  var cp1Y = 50;
  var cp2X = 175;
  var cp2Y = 150;

  ctx.moveTo(startX, startY);
  ctx.bezierCurveTo(cp1X, cp1Y, cp2X, cp2Y, endX, endY);

  ctx.stroke();
</script>

这里使用了 `bezierCurveTo()` 方法来绘制二次贝塞尔曲线。 `moveTo()` 方法用于将画笔移动到起始点， `stroke()` 方法用于绘制曲线。 通过调整起始点和控制点的位置和值，可以画出不同的 S 型曲线。