DYGraphs: Control multiple graphs with one RangeSelector

Question

I have two graphs on one page, which zoom and pan I want to be able to control with the same RangeSelector. In other words when I move the RangeSelector both graphs should react simultaneously.

The values in my first graph are small numbers between 2 and 20, and the numbers in my second graph have big values > 3000. This is the reason I don't want to put both lines in the same graph. Both graphs have the same date-time

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
             });

This is my jsfiddle

EDIT 1: there is a solution, that synchronizes zooming and panning Multiple graphs in sync example , but I still wonder if this is doable with range selector

Answer 1

我与 Dygraph 合作已经几个月了，我也有同样的问题。答案是有可能。

一旦您同步了多个dygraph的缩放，范围选择器也会同步。我想要做的是显示所有没有范围选择器的图表，并且在底部只有一个范围选择器来同时控制所有图表。我的解决方案是创建一个额外的空dygraph，也与其余部分同步，并在此图中添加范围选择器。我的结果如附图所示。