Javascript 点与直线坐标之间的运动学关系

点属性和直线对象的x、y坐标之间的实际关系是什么

假设我想画一条从10,10到100,10的线：

var line = new Kinetic.Line({
    points: [10,10,100,10],
    stroke: 'black',
    strokeWidth: 3
});

结果如下：

但是，如果我将x和y坐标添加到直线构造函数中，直线将发生移动：

var line = new Kinetic.Line({
    points: [10,10,100,10],
    stroke: 'black',
    strokeWidth: 3,
    x: 10,
    y: 10
});

为什么会这样？我将x和y设置为与点的第一个值相同，也就是说，我希望直线精确地从10,10开始。它为什么移动

---

我知道我这里缺少一些非常基本的东西，但我刚刚开始玩这个画布的东西。

对于KineticJS，通过将当前的x或y添加到数组中的每个值，可以对点数组进行内部更改：

points: [ 10+x, 10+y, 100+x ,10+y ],