Question

我试图通过Flot在图表中创建一个可拖动的行。我有一个函数可以完成它并在某个布尔值为true时在Flot的Plothover事件（类似于mouseMove事件）上执行。该函数被连续调用，这导致结果动画显着滞后。为了解决这个问题，我尝试了两种方法：

首先我尝试使用setTimeout。这有助于功能运行得更好，但我不满意。如果网页打开超过一分钟，动画又开始滞后，我不明白为什么。如果有人知道什么，那么任何见解都会受到赞赏。

其次，我尝试了Underscore的油门功能。我对语法有些不确定，经过一些研究和调试后，这就是我所确定的。以下代码位于事件处理程序中：

var throttled1 = _.throttle(singleLine, 50);
throttled1(position);

其中singleLine是以下函数，在事件处理程序之外定义：

function singleLine(position) {
      adjustLine1[0] = [position, Number.NEGATIVE_INFINITY];
      adjustLine1[1] = [position, Number.POSITIVE_INFINITY];
      graphData.push({ data: adjustLine1, lines: { show: true }, color: "gray" });
      plot.setData(graphData);
      plot.draw();
      graphData.pop();
}

请记住plot.draw（）是一个非常长的函数（它重绘整个图形）。无论如何，它似乎工作，因为throttled1（位置）成功调用了singleLine。但是，它根本没有提高性能。我正确使用它吗？关于如何使这种运行更好的任何其他见解也受到欢迎。感谢。

Answer 1

var throttled1 = _.throttle(singleLine, 50);

必须在事件侦听器之外初始化

throttled1，因此它可以在事件内部事件跟踪调用和计时器。

我正确使用Underscore的油门方法吗？

1 个答案: