From: Dan Vanderkam Date: Mon, 4 Oct 2010 14:16:31 +0000 (-0400) Subject: Merge branch 'master' of http://github.com/adam-p/dygraphs X-Git-Tag: v1.0.0~644 X-Git-Url: https://adrianiainlam.tk/git/?a=commitdiff_plain;h=895b3657b0ab22bb35815a1687c71116b2d8b36c;hp=8c03ba63fdda8a5b154f6db7fa57df154fd20437;p=dygraphs.git Merge branch 'master' of github.com/adam-p/dygraphs --- diff --git a/dygraph-canvas.js b/dygraph-canvas.js index cc1baaf..bf04e13 100644 --- a/dygraph-canvas.js +++ b/dygraph-canvas.js @@ -784,13 +784,14 @@ DygraphCanvasRenderer.prototype._renderLineChart = function() { for (var i = 0; i < setCount; i++) { var setName = setNames[i]; var color = this.colors[setName]; + var strokeWidth = this.dygraph_.attr_("strokeWidth", setName); // setup graphics context context.save(); var point = this.layout.points[0]; - var pointSize = this.dygraph_.attr_("pointSize"); + var pointSize = this.dygraph_.attr_("pointSize", setName); var prevX = null, prevY = null; - var drawPoints = this.dygraph_.attr_("drawPoints"); + var drawPoints = this.dygraph_.attr_("drawPoints", setName); var points = this.layout.points; for (var j = 0; j < points.length; j++) { var point = points[j]; @@ -808,17 +809,20 @@ DygraphCanvasRenderer.prototype._renderLineChart = function() { prevX = point.canvasx; prevY = point.canvasy; } else { - ctx.beginPath(); - ctx.strokeStyle = color; - ctx.lineWidth = this.options.strokeWidth; - ctx.moveTo(prevX, prevY); - if (stepPlot) { - ctx.lineTo(point.canvasx, prevY); + // TODO(danvk): figure out why this conditional is necessary. + if (strokeWidth) { + ctx.beginPath(); + ctx.strokeStyle = color; + ctx.lineWidth = strokeWidth; + ctx.moveTo(prevX, prevY); + if (stepPlot) { + ctx.lineTo(point.canvasx, prevY); + } + prevX = point.canvasx; + prevY = point.canvasy; + ctx.lineTo(prevX, prevY); + ctx.stroke(); } - prevX = point.canvasx; - prevY = point.canvasy; - ctx.lineTo(prevX, prevY); - ctx.stroke(); } if (drawPoints || isIsolated) { diff --git a/dygraph.js b/dygraph.js index ebd6ebe..074776f 100644 --- a/dygraph.js +++ b/dygraph.js @@ -240,8 +240,13 @@ Dygraph.prototype.__init__ = function(div, file, attrs) { this.start_(); }; -Dygraph.prototype.attr_ = function(name) { - if (typeof(this.user_attrs_[name]) != 'undefined') { +Dygraph.prototype.attr_ = function(name, seriesName) { + if (seriesName && + typeof(this.user_attrs_[seriesName]) != 'undefined' && + this.user_attrs_[seriesName] != null && + typeof(this.user_attrs_[seriesName][name]) != 'undefined') { + return this.user_attrs_[seriesName][name]; + } else if (typeof(this.user_attrs_[name]) != 'undefined') { return this.user_attrs_[name]; } else if (typeof(this.attrs_[name]) != 'undefined') { return this.attrs_[name]; @@ -1017,11 +1022,18 @@ Dygraph.prototype.mouseMove_ = function(event) { */ Dygraph.prototype.updateSelection_ = function() { // Clear the previously drawn vertical, if there is one - var circleSize = this.attr_('highlightCircleSize'); var ctx = this.canvas_.getContext("2d"); if (this.previousVerticalX_ >= 0) { + // Determine the maximum highlight circle size. + var maxCircleSize = 0; + var labels = this.attr_('labels'); + for (var i = 1; i < labels.length; i++) { + var r = this.attr_('highlightCircleSize', labels[i]); + if (r > maxCircleSize) maxCircleSize = r; + } var px = this.previousVerticalX_; - ctx.clearRect(px - circleSize - 1, 0, 2 * circleSize + 2, this.height_); + ctx.clearRect(px - maxCircleSize - 1, 0, + 2 * maxCircleSize + 2, this.height_); } var isOK = function(x) { return x && !isNaN(x); }; @@ -1057,6 +1069,8 @@ Dygraph.prototype.updateSelection_ = function() { ctx.save(); for (var i = 0; i < this.selPoints_.length; i++) { if (!isOK(this.selPoints_[i].canvasy)) continue; + var circleSize = + this.attr_('highlightCircleSize', this.selPoints_[i].name); ctx.beginPath(); ctx.fillStyle = this.plotter_.colors[this.selPoints_[i].name]; ctx.arc(canvasx, this.selPoints_[i].canvasy, circleSize, @@ -1587,8 +1601,6 @@ Dygraph.prototype.drawGraph_ = function(data) { this.setColors_(); this.attrs_['pointSize'] = 0.5 * this.attr_('highlightCircleSize'); - var connectSeparatedPoints = this.attr_('connectSeparatedPoints'); - // Loop over the fields (series). Go from the last to the first, // because if they're stacked that's how we accumulate the values. @@ -1599,6 +1611,8 @@ Dygraph.prototype.drawGraph_ = function(data) { for (var i = data[0].length - 1; i >= 1; i--) { if (!this.visibility()[i - 1]) continue; + var connectSeparatedPoints = this.attr_('connectSeparatedPoints', i); + var series = []; for (var j = 0; j < data.length; j++) { if (data[j][i] != null || !connectSeparatedPoints) { @@ -2312,6 +2326,14 @@ Dygraph.prototype.updateOptions = function(attrs) { if (attrs.valueRange) { this.valueRange_ = attrs.valueRange; } + + // TODO(danvk): validate per-series options. + // Supported: + // strokeWidth + // pointSize + // drawPoints + // highlightCircleSize + Dygraph.update(this.user_attrs_, attrs); Dygraph.update(this.renderOptions_, attrs); @@ -2426,6 +2448,18 @@ Dygraph.prototype.annotations = function() { return this.annotations_; }; +/** + * Get the index of a series (column) given its name. The first column is the + * x-axis, so the data series start with index 1. + */ +Dygraph.prototype.indexFromSetName = function(name) { + var labels = this.attr_("labels"); + for (var i = 0; i < labels.length; i++) { + if (labels[i] == name) return i; + } + return null; +}; + Dygraph.addAnnotationRule = function() { if (Dygraph.addedAnnotationCSS) return; diff --git a/tests/linear-regression-addseries.html b/tests/linear-regression-addseries.html index 3aa0632..4445f47 100644 --- a/tests/linear-regression-addseries.html +++ b/tests/linear-regression-addseries.html @@ -37,6 +37,7 @@ { labels: labels, drawPoints: true, + strokeWidth: 0.0, drawCallback: function(g, is_initial) { if (!is_initial) return; var c = g.getColors(); @@ -83,17 +84,23 @@ // Generate a new data set with the regression lines. var new_labels = []; var new_colors = []; + var new_opts = {}; for (var i = 0; i < labels.length; i++) { new_labels.push(labels[i]); if (i) new_colors.push(orig_colors[i - 1]); if (coeffs[i]) { // Darken the series by 50% to generate its regression. - new_labels.push(labels[i] + " Regression"); + var label = labels[i] + " Regression"; + new_labels.push(label); var c = new RGBColor(orig_colors[i - 1]); c.r = Math.floor(255 - 0.5 * (255 - c.r)); c.g = Math.floor(255 - 0.5 * (255 - c.g)); c.b = Math.floor(255 - 0.5 * (255 - c.b)); new_colors.push(c.toHex()); + new_opts[label] = { + drawPoints: false, + strokeWidth: 1.0 + }; } } @@ -108,49 +115,16 @@ } } - // TODO(danvk): set colors intelligently. - - g.updateOptions({ - file: new_data, - labels: new_labels, - colors: new_colors - }); + new_opts.file = new_data; + new_opts.labels = new_labels; + new_opts.colors = new_colors; + g.updateOptions(new_opts); } function clearLines() { for (var i = 0; i < coeffs.length; i++) coeffs[i] = null; updateChart(); } - - // function drawLines(ctx, area, layout) { - // if (typeof(g) == 'undefined') return; // won't be set on the initial draw. - - // var range = g.xAxisRange(); - // for (var i = 0; i < coeffs.length; i++) { - // if (!coeffs[i]) continue; - // var a = coeffs[i][1]; - // var b = coeffs[i][0]; - - // var x1 = range[0]; - // var y1 = a * x1 + b; - // var x2 = range[1]; - // var y2 = a * x2 + b; - - // var p1 = g.toDomCoords(x1, y1); - // var p2 = g.toDomCoords(x2, y2); - - // var color = g.getColors()[i - 1]; - // ctx.save(); - // ctx.strokeStyle = color; - // ctx.lineWidth = 1.0; - // ctx.beginPath(); - // ctx.moveTo(p1[0], p1[1]); - // ctx.lineTo(p2[0], p2[1]); - // ctx.closePath(); - // ctx.stroke(); - // ctx.restore(); - // } - // } diff --git a/tests/linear-regression.html b/tests/linear-regression.html index bed74e0..9f18d58 100644 --- a/tests/linear-regression.html +++ b/tests/linear-regression.html @@ -35,7 +35,8 @@ { labels: ['X', 'Y1', 'Y2'], underlayCallback: drawLines, - drawPoints: true + drawPoints: true, + strokeWidth: 0.0 } ); diff --git a/tests/per-series.html b/tests/per-series.html new file mode 100644 index 0000000..7b98dea --- /dev/null +++ b/tests/per-series.html @@ -0,0 +1,55 @@ + + + Per-Series Properties + + + + + + + +

Chart with per-series properties

+
+

+
+ + + +