From: Philippe Proulx Date: Tue, 25 Mar 2014 18:08:06 +0000 (-0400) Subject: Add `rangeSelectorCombinedSeries` option X-Git-Tag: v1.1.0~35 X-Git-Url: https://adrianiainlam.tk/git/?a=commitdiff_plain;h=1085dbced14037c23267ea9faf6a5a159b570c03;p=dygraphs.git Add `rangeSelectorCombinedSeries` option --- diff --git a/auto_tests/tests/range_selector.js b/auto_tests/tests/range_selector.js index 9f83188..1f4dfe8 100644 --- a/auto_tests/tests/range_selector.js +++ b/auto_tests/tests/range_selector.js @@ -451,6 +451,36 @@ RangeSelectorTestCase.prototype.testCombinedSeries = function() { }, combinedSeries); }; +// Tests selection of a specific series to average for the mini plot. +RangeSelectorTestCase.prototype.testSelectedCombinedSeries = function() { + var opts = { + showRangeSelector: true, + rangeSelectorCombinedSeries: [1, 3], // first and third series averaged, second skipped + labels: ['X', 'Y1', 'Y2', 'Y3', 'Y4'] + }; + var data = [ + [0, 5, 8, 13, 21], // average (first and third) = 9 + [5, 1, 3, 7, 14], // average (first and third) = 4 + [10, 0, 19, 10, 6] // average (first and third) = 5 + ]; + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, opts); + + var rangeSelector = g.getPluginInstance_(Dygraph.Plugins.RangeSelector); + assertNotNull(rangeSelector); + + var combinedSeries = rangeSelector.computeCombinedSeriesAndLimits_(); + assertEquals({ + yMin: 4 - 5 * 0.25, // 25% padding on combined series range. + yMax: 9 + 5 * 0.25, + data: [ + [0, 9], + [5, 4], + [10, 5] + ] + }, combinedSeries); +}; + // Tests data computation for the mini plot with a single error bar series. RangeSelectorTestCase.prototype.testSingleCombinedSeriesCustomBars = function() { var opts = { diff --git a/dygraph-options-reference.js b/dygraph-options-reference.js index 3030bc7..d31a794 100644 --- a/dygraph-options-reference.js +++ b/dygraph-options-reference.js @@ -793,6 +793,12 @@ Dygraph.OPTIONS_REFERENCE = // "type": "string", "description": "The range selector mini plot fill color. This can be of the form \"#AABBCC\" or \"rgb(255,100,200)\" or \"yellow\". You can also specify null or \"\" to turn off fill." }, + "rangeSelectorCombinedSeries": { + "default": "null", + "labels": ["Interactive Elements"], + "type": "array", + "description": "Array of series indexes (1 being the first serie) to combine for drawing the mini plot. The mini plot curve will be an average of these series. If \"null\", all series are combined." + }, "animatedZooms": { "default": "false", "labels": ["Interactive Elements"], diff --git a/dygraph.js b/dygraph.js index 038bf8b..bbfb3d8 100644 --- a/dygraph.js +++ b/dygraph.js @@ -320,6 +320,7 @@ Dygraph.DEFAULT_ATTRS = { rangeSelectorHeight: 40, rangeSelectorPlotStrokeColor: "#808FAB", rangeSelectorPlotFillColor: "#A7B1C4", + rangeSelectorCombinedSeries: null, // The ordering here ensures that central lines always appear above any // fill bars/error bars. diff --git a/plugins/range-selector.js b/plugins/range-selector.js index fe32b1a..e7e9362 100644 --- a/plugins/range-selector.js +++ b/plugins/range-selector.js @@ -647,15 +647,29 @@ rangeSelector.prototype.computeCombinedSeriesAndLimits_ = function() { var g = this.dygraph_; var logscale = this.getOption_('logscale'); - // Create a combined series (average of all series values). + // Create a combined series (average of selected series values). var i; + // Select series to combine + var selectedSeries = this.getOption_('rangeSelectorCombinedSeries'); + + // Default: select all series + if (selectedSeries === null) { + var numColumns = g.numColumns(); + selectedSeries = new Array(numColumns - 1); + + for (i = 1; i < numColumns; i++) { + selectedSeries[i - 1] = i; + } + } + // TODO(danvk): short-circuit if there's only one series. var rolledSeries = []; var dataHandler = g.dataHandler_; var options = g.attributes_; - for (i = 1; i < g.numColumns(); i++) { - var series = dataHandler.extractSeries(g.rawData_, i, options); + for (i = 0; i < selectedSeries.length; i++) { + var seriesIndex = selectedSeries[i]; + var series = dataHandler.extractSeries(g.rawData_, seriesIndex, options); if (g.rollPeriod() > 1) { series = dataHandler.rollingAverage(series, g.rollPeriod(), options); } diff --git a/tests/range-selector.html b/tests/range-selector.html index 2cb9615..c5c973b 100644 --- a/tests/range-selector.html +++ b/tests/range-selector.html @@ -30,6 +30,11 @@

+ Use the average of a specific subset of series to draw the mini plot (only the first serie is used in this test). + The default behaviour is to compute the average of all series. +

+
+

Demo of range selecor without the chart. (interesting if multiple charts should be synced with one range selector).

@@ -65,6 +70,21 @@ } ); g3 = new Dygraph( + document.getElementById("selectcombined"), + [ + [0, 1, 4, 10], + [10, 2, 8, 19], + [25, 15, 4, 2], + [35, 0, 3, 2] + ], + { + title: 'Daily Temperatures in New York vs. San Francisco', + ylabel: 'Temperature (F)', + showRangeSelector: true, + rangeSelectorCombinedSeries: [1] + } + ); + g4 = new Dygraph( document.getElementById("nochart"), [[0,1],[10,1]], {