使用js在rails中创建多段线

<canvas id="myCanvas" width="500" height="500"></canvas>

document.addEventListener("DOMContentLoaded", function() {
  var canvas = document.getElementById("myCanvas");
  var ctx = canvas.getContext("2d");

  // 定义多段线的坐标点
  var points = [
    { x: 50, y: 50 },
    { x: 100, y: 100 },
    { x: 150, y: 50 },
    { x: 200, y: 100 }
  ];

  // 绘制多段线
  ctx.beginPath();
  ctx.moveTo(points[0].x, points[0].y);
  for (var i = 1; i < points.length; i++) {
    ctx.lineTo(points[i].x, points[i].y);
  }
  ctx.stroke();
});