kinetic关系点与坐标之间的关系

Question

点属性与Line对象的x，y坐标之间的实际关系是什么？

说我想从10,10到100,10画一条线：

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

结果在这里：http://jsfiddle.net/4Y6MG/

但是，如果我将x和y坐标添加到Line构造函数中，则会移动该行：

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

http://jsfiddle.net/qyfD2/1/

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

我知道我在这里遗漏了一些非常基本的东西，但我刚开始玩这种画布。

Answer 1

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

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