JUMflot如何重新绘制点/选择项目？尝试将项添加到数组中，并在不影响原始项的情况下重新绘制它们。

Question

本质上，我要做的是让一个按钮.push，一条线到一个数组，我希望JUMflot继续重新绘制这些，但不影响被推入的线。

我最初所做的是拥有这样的东西(生成器ID是我的按钮，选项是定义的，但是与我的问题无关，所以我没有包括它们)：

var genVector=[[0,1],[6,6]]; //line being pushed in

var data = [];

$("#generator").click(function(){ 
    data.push({data: genVector, editable: true});
    var p = $.plot($("#graph"),data,options); 
});

$("#graph").bind("datadrop", function(event,pos,item) { 
    data[item.seriesIndex].data[item.dataIndex] = [Math.round(pos.x1),Math.round(pos.y1)];
    p = $.plot($("#graph"), data, options);
};

我意识到，每次我选择移动点时，我的genVector坐标都会发生变化。因此，为了解决这个问题，我做了以下工作：

var vectorCounter=0;

var genVector=[[0,1],[6,6]];

var data = [];

var vectorArray=[];

$("#generator").click(function(){
    vectorArray.push(genVector);
    data.push({data: vectorArray[vectorCounter], editable: true});
    vectorCounter++;
    var p = $.plot($("#graph"),data,options);
});

$("#graph").bind("datadrop", function(event,pos,item) { 
    data[item.seriesIndex].data[item.dataIndex] = [Math.round(pos.x1),Math.round(pos.y1)];
    p = $.plot($("#graph"), data, options);
};

我认为将向量添加到单独的数组并从那里修改它将使genVector不受影响。但事实并非如此。

我假设这与JUMflot代码的编写方式有关？即使没有，我怎样才能达到我正在做的事情呢？提前感谢！

Answer 1

这与JUMflot无关，而是一个关于对象引用的问题。

当将genVector推入vectorArray时：

vectorArray.push(genVector);

这并不是在向量数组中创建一个新的数组，而是vectorArray现在保存了对genVector的引用。

因此，当您将vectorArray[0]推入data中时，您只是得到了对原始genVector的引用。图示如下：

> data[0].data[0] = "Mark is Awesome";
  "Mark is Awesome"
> genVector
  ["Mark is Awesome", 
    Array[2]
  ]

这一整个概念可以更简单地用以下方式显示：

> x = [1,2,3];
  [1, 2, 3]
> y = x
  [1, 2, 3]
> y[0] = "Mark is Awesome"
  "Mark is Awesome"
> x
  ["Mark is Awesome", 2, 3]

所以问题是，你如何复制或克隆一个数组？最简单的方法是使用切片技巧：

> x = [1,2,3];
  [1, 2, 3]
> y = x.slice(0);
  [1, 2, 3]
> y[0] = "Mark is Awesome"
  "Mark is Awesome"
> x
  [1, 2, 3]

这是一个浅拷贝，但是，如果数组包含一个对象引用，它不会克隆它：

> x = [{'a':'b'},2,3];
  [Object, 2, 3]
> y = x.slice(0);
  [Object, 2, 3]
> y[0]['a'] = "Mark is Awesome"
  "Mark is Awesome"
> x
  [Object
     a: "Mark is Awesome"
     __proto__: Object
     , 2, 3]

如果你想克隆所有的东西，你需要使用一个深拷贝。我不会详细讨论这个问题，因为我只是在复制出色的讨论这里。