From b9b21c088657fe710810f37ca91fddd31dd9f580 Mon Sep 17 00:00:00 2001 From: kchengsignalfuse Date: Mon, 5 Dec 2016 19:04:49 -0800 Subject: [PATCH] add the ability to highlight multiple series with setSelection --- auto_tests/tests/selection.js | 14 ++++++++++++++ src/dygraph-options-reference.js | 2 +- src/dygraph.js | 16 ++++++++++++---- 3 files changed, 27 insertions(+), 5 deletions(-) diff --git a/auto_tests/tests/selection.js b/auto_tests/tests/selection.js index bb8e8522a..dc158c37c 100644 --- a/auto_tests/tests/selection.js +++ b/auto_tests/tests/selection.js @@ -50,6 +50,20 @@ it('testSetGetSelectionDense', function() { assert.equal(3, g.getSelection()); }); +it('testSetGetSelectionMulti', function() { + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, + "X,Y,Z\n" + + "1,1,1\n" + + "50,50,50\n" + + "50.0001,50.0001,50.0001\n" + + "100,100,100\n" + ); + + g.setSelection(false, ['Y','Z']); + assert.deepEqual(['Y','Z'], g.getHighlightSeries()); +}); + it('testSetGetSelectionMissingPoints', function() { var dataHandler = function() {}; dataHandler.prototype = new DefaultHandler(); diff --git a/src/dygraph-options-reference.js b/src/dygraph-options-reference.js index dc9243b37..99d8d5d26 100644 --- a/src/dygraph-options-reference.js +++ b/src/dygraph-options-reference.js @@ -127,7 +127,7 @@ OPTIONS_REFERENCE = // ["x", "the x-coordinate of the highlighted points"], ["points", "an array of highlighted points: [ {name: 'series', yval: y-value}, … ]"], ["row", "integer index of the highlighted row in the data table, starting from 0"], - ["seriesName", "name of the highlighted series, only present if highlightSeriesOpts is set."] + ["seriesName", "name or names of the highlighted series, only present if highlightSeriesOpts is set."] ] }, "drawHighlightPointCallback": { diff --git a/src/dygraph.js b/src/dygraph.js index e0fcb58ca..c054d346a 100644 --- a/src/dygraph.js +++ b/src/dygraph.js @@ -1743,7 +1743,13 @@ Dygraph.prototype.updateSelection_ = function(opt_animFraction) { // Redraw only the highlighted series in the interactive canvas (not the // static plot canvas, which is where series are usually drawn). - this.plotter_._renderLineChart(this.highlightSet_, ctx); + if(utils.isArrayLike(this.highlightSet_)) { + for( var i = 0; i < this.highlightSet_.length; i++) { + this.plotter_._renderLineChart(this.highlightSet_[i], ctx); + } + } else { + this.plotter_._renderLineChart(this.highlightSet_, ctx); + } } else if (this.previousVerticalX_ >= 0) { // Determine the maximum highlight circle size. var maxCircleSize = 0; @@ -1793,8 +1799,8 @@ Dygraph.prototype.updateSelection_ = function(opt_animFraction) { * * @param {number} row Row number that should be highlighted (i.e. appear with * hover dots on the chart). - * @param {seriesName} optional series name to highlight that series with the - * the highlightSeriesOpts setting. + * @param {seriesName} optional series name(string, or array of strings) to + * highlight with the the highlightSeriesOpts setting. * @param { locked } optional If true, keep seriesName selected when mousing * over the graph, disabling closest-series highlighting. Call clearSelection() * to unlock it. @@ -1840,7 +1846,9 @@ Dygraph.prototype.setSelection = function(row, opt_seriesName, opt_locked) { } if (opt_seriesName !== undefined) { - if (this.highlightSet_ !== opt_seriesName) changed = true; + var stringifiedNew = utils.isArrayLike(opt_seriesName)?opt_seriesName.join():opt_seriesName; + var stringifiedOld = utils.isArrayLike(this.highlightSet_)?this.highlightSet_.join():this.highlightSet_; + if (stringifiedOld !== stringifiedNew) changed = true; this.highlightSet_ = opt_seriesName; }