test range selector creation/deletion
[dygraphs.git] / src / extras / synchronizer.js
CommitLineData
8cadc6c9
DV
1/**
2 * Synchronize zooming and/or selections between a set of dygraphs.
3 *
4 * Usage:
5 *
6 * var g1 = new Dygraph(...),
7 * g2 = new Dygraph(...),
8 * ...;
9 * var sync = Dygraph.synchronize(g1, g2, ...);
10 * // charts are now synchronized
11 * sync.detach();
12 * // charts are no longer synchronized
13 *
14 * You can set options using the last parameter, for example:
15 *
16 * var sync = Dygraph.synchronize(g1, g2, g3, {
17 * selection: true,
18 * zoom: true
19 * });
20 *
21 * The default is to synchronize both of these.
22 *
b94ba4b5 23 * Instead of passing one Dygraph object as each parameter, you may also pass an
8cadc6c9
DV
24 * array of dygraphs:
25 *
26 * var sync = Dygraph.synchronize([g1, g2, g3], {
27 * selection: false,
28 * zoom: true
29 * });
b94ba4b5
DV
30 *
31 * You may also set `range: false` if you wish to only sync the x-axis.
32 * The `range` option has no effect unless `zoom` is true (the default).
8cadc6c9
DV
33 */
34(function() {
35/* global Dygraph:false */
36'use strict';
37
38Dygraph.synchronize = function(/* dygraphs..., opts */) {
39 if (arguments.length === 0) {
40 throw 'Invalid invocation of Dygraph.synchronize(). Need >= 1 argument.';
41 }
42
b94ba4b5 43 var OPTIONS = ['selection', 'zoom', 'range'];
8cadc6c9
DV
44 var opts = {
45 selection: true,
8fd11236 46 zoom: true,
b94ba4b5 47 range: true
8cadc6c9
DV
48 };
49 var dygraphs = [];
50
fab3f9b4 51 var prevCallbacks = {
52 draw: null,
53 highlight: null,
54 unhighlight: null
55 };
56
8cadc6c9
DV
57 var parseOpts = function(obj) {
58 if (!(obj instanceof Object)) {
59 throw 'Last argument must be either Dygraph or Object.';
60 } else {
61 for (var i = 0; i < OPTIONS.length; i++) {
62 var optName = OPTIONS[i];
63 if (obj.hasOwnProperty(optName)) opts[optName] = obj[optName];
64 }
65 }
66 };
67
68 if (arguments[0] instanceof Dygraph) {
69 // Arguments are Dygraph objects.
70 for (var i = 0; i < arguments.length; i++) {
71 if (arguments[i] instanceof Dygraph) {
72 dygraphs.push(arguments[i]);
73 } else {
74 break;
75 }
76 }
77 if (i < arguments.length - 1) {
78 throw 'Invalid invocation of Dygraph.synchronize(). ' +
79 'All but the last argument must be Dygraph objects.';
80 } else if (i == arguments.length - 1) {
81 parseOpts(arguments[arguments.length - 1]);
82 }
83 } else if (arguments[0].length) {
84 // Invoked w/ list of dygraphs, options
85 for (var i = 0; i < arguments[0].length; i++) {
86 dygraphs.push(arguments[0][i]);
87 }
88 if (arguments.length == 2) {
89 parseOpts(arguments[1]);
90 } else if (arguments.length > 2) {
91 throw 'Invalid invocation of Dygraph.synchronize(). ' +
92 'Expected two arguments: array and optional options argument.';
93 } // otherwise arguments.length == 1, which is fine.
94 } else {
95 throw 'Invalid invocation of Dygraph.synchronize(). ' +
96 'First parameter must be either Dygraph or list of Dygraphs.';
97 }
98
99 if (dygraphs.length < 2) {
100 throw 'Invalid invocation of Dygraph.synchronize(). ' +
101 'Need two or more dygraphs to synchronize.';
102 }
23e6849f
RN
103
104 var readycount = dygraphs.length;
105 for (var i = 0; i < dygraphs.length; i++) {
106 var g = dygraphs[i];
107 g.ready( function() {
108 if (--readycount == 0) {
109 // Listen for draw, highlight, unhighlight callbacks.
110 if (opts.zoom) {
111 attachZoomHandlers(dygraphs, opts, prevCallbacks);
112 }
8cadc6c9 113
23e6849f
RN
114 if (opts.selection) {
115 attachSelectionHandlers(dygraphs, prevCallbacks);
116 }
117 }
118 });
8cadc6c9 119 }
23e6849f 120
8cadc6c9
DV
121 return {
122 detach: function() {
123 for (var i = 0; i < dygraphs.length; i++) {
124 var g = dygraphs[i];
125 if (opts.zoom) {
fab3f9b4 126 g.updateOptions({drawCallback: prevCallbacks.draw});
8cadc6c9
DV
127 }
128 if (opts.selection) {
129 g.updateOptions({
fab3f9b4 130 highlightCallback: prevCallbacks.highlight,
131 unhighlightCallback: prevCallbacks.unhighlight
8cadc6c9
DV
132 });
133 }
134 }
135 // release references & make subsequent calls throw.
136 dygraphs = null;
137 opts = null;
1ca560d2 138 prevCallbacks = null;
8cadc6c9
DV
139 }
140 };
141};
142
fab3f9b4 143function attachZoomHandlers(gs, syncOpts, prevCallbacks) {
8cadc6c9
DV
144 var block = false;
145 for (var i = 0; i < gs.length; i++) {
146 var g = gs[i];
fab3f9b4 147 prevCallbacks.draw = g.getFunctionOption('drawCallback');
8cadc6c9
DV
148 g.updateOptions({
149 drawCallback: function(me, initial) {
fab3f9b4 150 if (prevCallbacks.draw) prevCallbacks.draw(me, initial);
8cadc6c9
DV
151 if (block || initial) return;
152 block = true;
b94ba4b5
DV
153 var opts = {
154 dateWindow: me.xAxisRange()
155 };
156 if (syncOpts.range) opts.valueRange = me.yAxisRange();
157
8cadc6c9
DV
158 for (var j = 0; j < gs.length; j++) {
159 if (gs[j] == me) continue;
b94ba4b5 160 gs[j].updateOptions(opts);
8cadc6c9
DV
161 }
162 block = false;
163 }
164 }, false /* no need to redraw */);
165 }
166}
167
fab3f9b4 168function attachSelectionHandlers(gs, prevCallbacks) {
8cadc6c9
DV
169 var block = false;
170 for (var i = 0; i < gs.length; i++) {
171 var g = gs[i];
fab3f9b4 172 prevCallbacks.highlight = g.getFunctionOption('highlightCallback');
173 prevCallbacks.unhighlight = g.getFunctionOption('unhighlightCallback');
8cadc6c9
DV
174 g.updateOptions({
175 highlightCallback: function(event, x, points, row, seriesName) {
12a43449 176 if (prevCallbacks.highlight) {
177 prevCallbacks.highlight(event, x, points, row, seriesName);
178 }
8cadc6c9
DV
179 if (block) return;
180 block = true;
181 var me = this;
182 for (var i = 0; i < gs.length; i++) {
183 if (me == gs[i]) continue;
fcf37b29 184 var idx = gs[i].getRowForX(x);
8cadc6c9
DV
185 if (idx !== null) {
186 gs[i].setSelection(idx, seriesName);
187 }
188 }
189 block = false;
190 },
191 unhighlightCallback: function(event) {
fab3f9b4 192 if (prevCallbacks.unhighlight) prevCallbacks.unhighlight(event);
8cadc6c9
DV
193 if (block) return;
194 block = true;
195 var me = this;
196 for (var i = 0; i < gs.length; i++) {
197 if (me == gs[i]) continue;
198 gs[i].clearSelection();
199 }
200 block = false;
201 }
202 });
203 }
204}
205
8cadc6c9 206})();