Javascript 将要绘制的点数组传递到画布上

我试图将一组点传递到Javascript画布上。该脚本正在从JSON文件中提取数组。我知道ajax调用连接到JSON文件，所以我不打算在问题中包括这一点。下面是脚本和JSON文件

JS

var x1 = result[0].back_line.x1;
var y1 = result[0].back_line.y1;
var x2 = result[0].back_line.x2;
var y2 = result[0].back_line.y2;
var stroke = result[0].back_line.stroke;
var stroke_width = result[0].back_line.width;

for(var i = 0; i < x1.length - 1; i++){
    ctx.beginPath();
    ctx.moveTo(x1[i], y1[i]);
    ctx.lineTo(x2[i], y2[i]);
    ctx.lineWidth = stroke_width;
    ctx.strokeStyle = stroke;
    ctx.stroke();
}

我得到的错误是：

未捕获类型错误：无法读取未定义的属性“x1”

---

但是，如果我不做数组，只做一个点，就不会有错误，线会画在画布上我在数组中循环是否错误？是否需要为每个阵列执行多个for循环？由于数组长度相同，我应该只需要遍历其中一个，对吗？

在您编写的JS代码中：

var x1 = result[0].back_line.x1;

试一试

var x1 = result[0].back_lines.x1;

---

应该是

结果[0]。返回行

否？谢谢您的回答。我将向您投赞成票并接受它，但答案已在评论中指出。谢谢：）user3906922已在我键入^^时回答了HTML Canvas祝您好运

var x1 = result[0].back_lines.x1;