Question

我在一个页面上有两个图表，我希望能够使用相同的RangeSelector控制缩放和平移。换句话说，当我移动RangeSelector时，两个图形应该同时响应。

我的第一个图表中的值是2到20之间的小数字，而我的第二个图表中的数字具有大的值＆gt; 3000.这就是我不想将两条线放在同一图表中的原因。两个图表都具有相同的日期时间

g1 = new Dygraph(document.getElementById("graph1"),
             // For possible data formats, see http://dygraphs.com/data.html
             // The x-values could also be dates, e.g. "2012/03/15"
             "X,Y\n" +
             "1,4\n" +
             "2,2\n" +
             "3,4\n" +
             "4,6\n" +
             "5,8\n" +
             "6,3\n" +
             "7,12\n" +
             "8,14\n",
             {
                 showRangeSelector: true
             });
g2 = new Dygraph(document.getElementById("graph2"),
             // For possible data formats, see http://dygraphs.com/data.html
             // The x-values could also be dates, e.g. "2012/03/15"
             "X,Y\n" +
             "1,4356\n" +
             "2,4789\n" +
             "3,4812\n" +
             "4,5012\n" +
             "5,4675\n" +
             "6,4357\n" +
             "7,4467\n" +
             "8,5134\n",
             {
                    // options
             });

这是我的jsfiddle

编辑1：有一个解决方案，可以同步缩放和平移Multiple graphs in sync example，但我仍然想知道这是否适用于范围选择器

Answer 1

I have been working with Dygraph for a few months and I had this same question. The answer is that it is possible.

Once you synchronize the zoom of several dygraphs, the range selector is synchronized too. What I wanted to do is to show all the graphs without range selector and to have only one range selector at the bottom to control all the graphs at the same time. My solution was to create an additional empty dygraph also synchronized with the rest of them, and to add the range selector in this graph. My result is shown in the image attached.

DYGraphs：使用一个RangeSelector控制多个图形

1 个答案: