Question

我指的是http://dygraphs.com/tests/synchronize.html。

现在我自己的实现也给了我适合，这并不奇怪，因为我将它作为官方示例的编辑版本开发。

试试这个：在页面加载时转到四个图形中的任何一个，在中间的一个瘦小部分进行放大（从左到右点击拖动）;然后双击。

发生什么事了？您放大并且曲线垂直填充图形，但是稍微填充---自动缩放。然后在双击时缩小一切似乎与之前一样。啊......但除非你重新加载页面，否则它仍然没有。

现在移动到四个图形中的任何一个并重复第一步...放大同一个瘦小的点（这些图形的数据恰好相同）。请注意，缺少自动垂直缩放。在重新加载页面之前，这是所有四个图表中的永久条件。

这是在Ubuntu 12.04 LTS上的最新版本的Firefox。您只需查看网页源即可看到Javascript。我一直在想它与blockRedraw布尔值的因果关系有关，但是我的更复杂的努力还没有完成。

Answer 1

我相信我最适合回答我自己的问题，虽然这有点尴尬。在发布问题后，我在这个简单的事情上烧了好几个小时。这是代码和答案：

`    <script type="text/javascript">
  gs = [];
  var blockRedraw = false;
  var initialized = false;
  for (var i = 1; i <= 4; i++) {
    gs.push(
      new Dygraph(
        document.getElementById("div" + i),
        NoisyData, {
          rollPeriod: 7,
          errorBars: true,
          drawCallback: function(me, initial) {
            if (blockRedraw || initial) return;
            blockRedraw = true;
            var range = me.xAxisRange();
            //var yrange = me.yAxisRange();
            for (var j = 0; j < 4; j++) {
              if (gs[j] == me) continue;
              gs[j].updateOptions( {
                dateWindow: range/*,
                valueRange: yrange*/
              } );
            }
            blockRedraw = false;
          }
        }
      )
    );
  }
</script>`

那里的代码直接从dygraphs.com synchronize.html页面复制，除了我已经注释掉var yrange = me.yAxisRange（）以及updateOptions（）参数的valueRange部分。

显然，如果你把这些范围值放在那里，你就会阻止发生自动缩放。我真的不知道幕后发生了什么，但这似乎就是这笔交易。它解决了我自己的类似实现的问题。（也就是说，我发现dygraphs.com提供的jsfiddle版本实际上并没有绘制图形，因此无法进行测试。所以我只在我的版本上进行了测试，这几乎是相同的。）< / p>

官方dygraphs.com synchronize.html演示被破坏了：我的版本也是

1 个答案: