修改数组中的子项

时间:2010-07-14 02:22:33

标签: javascript jquery

现在我有一个包含120对的数组。例如:

[[1, 12],
 [2, 15],
 [3, 10]]

基本上120长。现在我在Jquery Flot图中使用这些数据。 “I have a live example on jsFiddle here

代码:

var numbers = [];
var jsonString = "";
var PlotData;
var x = 0;

function EveryOneSec() {
  if (numbers.length == 120) {
      numbers.shift();
  }
  numbers.push([x++, Math.random()*10]);
  PlotData = numbers;
  $.plot($("#PlaceHolder"), [{ data: PlotData, points: { show: true},lines: { show: true }}]);
    console.log(PlotData);
  setTimeout(EveryOneSec, 1000);
}
EveryOneSec();

我正在动态创建数字(see jsFiddle Example),只是第一个数字的简单增量为1,第二个数字随机数字现在这一切都运行得很好并且再次计算起来看看jsfiddle例子。

现在我想尝试做的不是将数字增加1而是使用数组。因此第一对数组始终为[1,##],第120对总是为数组内的所有[120,##]。这个想法是它每1秒更新一次,所以最接近左边轴的最终结果是120秒显示120秒或2分钟。

所以问题是: 最有效的方法是什么?

因为动态添加的号码在下次更新时会立即过时。

1 个答案:

答案 0 :(得分:1)

一个包含120个元素的数组不需要很长时间来迭代,所以做一个for ... next就可以了,IMO。清理代码,你可以:

var numbers = [];
var jsonString = "";

function EveryOneSec() {
  numbers.push(Math.round(Math.random()*10));  // generate integer from 0-10
  numbers = numbers.slice(-120); // keep only the last 120 max elements every time
  var PlotData = $.map(numbers, function(n,i) { return [[i+1,n]]; });
  $.plot($("#PlaceHolder"), [{ data: PlotData, points: { show: true},lines: { show: true }]);
  console.log(PlotData);
}
var timer = setInterval(EveryOneSec, 1000);

// you can stop the timer with clearInterval(timer);

******编辑****:上面的代码将从右向左“滚动”点,为了反转这个,你可以取消移动数据而不是推,只需替换前两行的这个功能

numbers.unshift(Math.round(Math.random()*10));  // generate integer from 0-10
numbers = numbers.slice(0, 120); // keep only the fist 120 max elements every time

你将从左向右“滚动”:)

要反转轴(从120到0),只需替换返回的值:[[120-i,n]]