动态动态趋势与同步

Question

我的页面上有两张动态图。定期从源读取新的时间序列数据并将其写入局部变量，然后使用以下命令更新图表：

    vm.graph1.updateOptions(
      { 'file': customData1, 'labels': vm.labels1 });
    vm.graph2.updateOptions(
      { 'file': customData2, 'labels': vm.labels2 });

这是非常好的工作，图表显示实时趋势如预期。但是，当我试图通过包含syncrhonizer.js并使用以下命令来同步这两个图时：

vm.graphSync = Dygraph.synchronize(vm.graph1, vm.graph2);

然后“实时更新”停止工作。换句话说，图形不显示任何新的传入值(它只是显示相同的静态时间跨度)。同步工作很好，无论是选择和缩放。

数据仍在更新，但现在我必须双击图形(或手动pan)，以查看最新的数据。

有谁有任何想法或工作解决方案，以同步使用动态趋势？

Answer 1

这是一个可行的解决方案，然而，我不得不改变"synchronizer.js“从图形，所以意见和其他建议仍然欢迎。

在attachZoomHandlers函数中的synchronizer.js中，我做了以下更改：

for (var j = 0; j < gs.length; j++) {
    if (gs[j] == me) continue;

    //added if/else block, the original code was the stuff inside else block
    if (me.ignoreXrangeSync && me.ignoreXrangeSync === true) {
        //if ignoreXrangeSync flag is set, only update y-range
        gs[j].updateOptions( {
           valueRange: yrange
       });
    }
    else {
      //if ignoreXrangeSync flag is NOT set, run original code (so manual zoom works)
      gs[j].updateOptions( {
         dateWindow: range,
         valueRange: yrange
      });
   }
}

在我的原始代码中，我做了这个改变。

vm.graph1.ignoreXrangeSync = vm.graph2.ignoreXrangeSync = true;
vm.graph1.updateOptions(
      { 'file': customData1, 'labels': vm.labels1 });
vm.graph2.updateOptions(
      { 'file': customData2, 'labels': vm.labels2 });
vm.graph1.ignoreXrangeSync = vm.graph2.ignoreXrangeSync = false;

另外，我需要为我的动态趋势图添加这些缩放回调(每个图一个)，以便在手动缩放图形后双击开始。

var graph1ZoomCallback = function () {   //callback for graph1
    if(!vm.graph1.isZoomed()) {          //if graph1 has been double clicked
      vm.graph2.ignoreXrangeSync = true; //note, graph2
      vm.graph2.resetZoom();
      vm.graph2.ignoreXrangeSync = false;
    }
}

Answer 2

您需要在更新数据之后显式地设置dateWindow：

vm.graph1.updateOptions(
  { 'file': customData1, 'labels': vm.labels1 });
vm.graph2.updateOptions(
  { 'file': customData2, 'labels': vm.labels2 });
vm.graph1.updateOptions({
  dateWindow: vm.graph1.xAxisExtremes()
});
// ^^^ this will synchronize the other charts, too

您必须这样做的事实可以被认为是带有同步器的错误。可以随意使用提出问题来对抗图形，最好是通过dygraphs.com/fiddle链接到repro。