我是 JavaScript 新手,我仍然习惯它的工作方式。我有一个绘制实时图表的函数,该图表通过从数据库查询中获取数据来不断更新,使用以下代码完成:
watch = setTimeout(function() {
updateGraph(parameters, ...);
},updateTimeInterval);
图形更新需要一些时间来执行,当然这也取决于 updateTimeInterval 的值。例如,如果 updateTimeInterval 设置为 1000 毫秒,则绘图会在 8 秒(平均)内使用新值更新,而如果设置为 5000 毫秒,则绘图会在 15 秒内更新。
此更新会一直发生,直到按下停止绘图过程的停止按钮。
function stopPlotting() {
clearTimeout(watch);
}
这只有在正确的时刻按下停止按钮时才能正常工作,即在 setTimeout 内开始执行函数之前。在我看来,由于执行此功能的延迟,事情变得更加复杂。自然地,人们希望通过按下停止按钮自动停止绘图,而无需等待“正确”的时刻。有什么方法可以用 JavaScript 实现吗?我找不到任何解决这个问题的方法。谢谢!
编辑:
updateGraph() 是一个从数据库中检索数据的函数。一旦获得数据,该函数就会使用最新信息重绘(更新)图形。这会根据 setTimeout 指定的时间延迟连续发生。该图表将永远更新,直到有人按下该停止按钮。
编辑2:
我在 updateGraph() 函数的几个地方设置了一个标志,如果标志的值发生变化,则返回 false。在 clearTimeout() 之前的 stopPlotting() 函数中更改了标志的值。这实际上起到了作用,图表的绘制停止了。
但是,出现了一个新问题:如果现在我想从头开始重新绘制图形,这是不可能的。这是因为标志的值已经改变了,它在 updateGraph() 函数中总是返回 false,所以什么都不会被绘制。你对此有什么提示吗?
编辑3:
提示是在 stopPlotting() 函数中更改另一个布尔变量,并在 updateGraph() 中检查值是否已更改(如果是,则更改标志的值)。这将允许您从头开始绘制图形多次。PS 布尔变量和标志都被声明为全局变量。