fractions: false,
wilsonInterval: true, // only relevant if fractions is true
customBars: false,
- fillGraph: false
+ fillGraph: false,
+ fillAlpha: 0.15,
+
+ stackedGraph: false,
+ hideOverlayOnMouseOut: true
};
// Various logging levels.
this.height_ = (this.height_ * self.innerHeight / 100) - 10;
}
+ // TODO(danvk): set fillGraph to be part of attrs_ here, not user_attrs_.
+ if (attrs['stackedGraph']) {
+ attrs['fillGraph'] = true;
+ // TODO(nikhilk): Add any other stackedGraph checks here.
+ }
+
// Dygraphs has many options, some of which interact with one another.
// To keep track of everything, we maintain two sets of options:
//
* @private
*/
Dygraph.prototype.createPlotKitCanvas_ = function(canvas) {
- // var h = document.createElement("canvas");
var h = Dygraph.createCanvas();
h.style.position = "absolute";
+ // TODO(danvk): h should be offset from canvas. canvas needs to include
+ // some extra area to make it easier to zoom in on the far left and far
+ // right. h needs to be precisely the plot area, so that clipping occurs.
h.style.top = canvas.style.top;
h.style.left = canvas.style.left;
h.width = this.width_;
var val = this.attr_('colorValue') || 0.5;
for (var i = 1; i <= num; i++) {
if (!this.visibility()[i-1]) continue;
- var hue = (1.0*i/(1+num));
- this.colors_.push( Dygraph.hsvToRGB(hue, sat, val) );
+ // alternate colors for high contrast.
+ var idx = i - parseInt(i % 2 ? i / 2 : (i - num)/2, 10);
+ var hue = (1.0 * idx/ (1 + num));
+ this.colors_.push(Dygraph.hsvToRGB(hue, sat, val));
}
} else {
for (var i = 0; i < num; i++) {
Dygraph.update(this.layoutOptions_, this.attrs_);
}
-// The following functions are from quirksmode.org
+/**
+ * Return the list of colors. This is either the list of colors passed in the
+ * attributes, or the autogenerated list of rgb(r,g,b) strings.
+ * @return {Array<string>} The list of colors.
+ */
+Dygraph.prototype.getColors = function() {
+ return this.colors_;
+};
+
+// The following functions are from quirksmode.org with a modification for Safari from
+// http://blog.firetree.net/2005/07/04/javascript-find-position/
// http://www.quirksmode.org/js/findpos.html
Dygraph.findPosX = function(obj) {
var curleft = 0;
- if (obj.offsetParent) {
- while (obj.offsetParent) {
+ if(obj.offsetParent)
+ while(1)
+ {
curleft += obj.offsetLeft;
+ if(!obj.offsetParent)
+ break;
obj = obj.offsetParent;
}
- }
- else if (obj.x)
+ else if(obj.x)
curleft += obj.x;
return curleft;
};
Dygraph.findPosY = function(obj) {
var curtop = 0;
- if (obj.offsetParent) {
- while (obj.offsetParent) {
+ if(obj.offsetParent)
+ while(1)
+ {
curtop += obj.offsetTop;
+ if(!obj.offsetParent)
+ break;
obj = obj.offsetParent;
}
- }
- else if (obj.y)
+ else if(obj.y)
curtop += obj.y;
return curtop;
};
+
+
/**
* Create the div that contains information on the selected point(s)
* This goes in the top right of the canvas, unless an external div has already
if (this.attr_("highlightCallback")) {
var px = this.lastHighlightCallbackX;
if (px !== null && lastx != px) {
- this.attr_("highlightCallback")(event, lastx, this.selPoints_);
+ // only fire if the selected point has changed.
this.lastHighlightCallbackX = lastx;
+ if (!this.attr_("stackedGraph")) {
+ this.attr_("highlightCallback")(event, lastx, this.selPoints_);
+ } else {
+ // "unstack" the points.
+ var callbackPoints = this.selPoints_.map(
+ function(p) { return {xval: p.xval, yval: p.yval, name: p.name} });
+ var cumulative_sum = 0;
+ for (var j = callbackPoints.length - 1; j >= 0; j--) {
+ callbackPoints[j].yval -= cumulative_sum;
+ cumulative_sum += callbackPoints[j].yval;
+ }
+ this.attr_("highlightCallback")(event, lastx, callbackPoints);
+ }
}
}
this.lastx_ = lastx;
// Draw colored circles over the center of each selected point
- ctx.save()
+ ctx.save();
for (var i = 0; i < this.selPoints_.length; i++) {
if (!isOK(this.selPoints_[i%clen].canvasy)) continue;
ctx.beginPath();
* @private
*/
Dygraph.prototype.mouseOut_ = function(event) {
- // Get rid of the overlay data
- var ctx = this.canvas_.getContext("2d");
- ctx.clearRect(0, 0, this.width_, this.height_);
- this.attr_("labelsDiv").innerHTML = "";
+ if (this.attr_("hideOverlayOnMouseOut")) {
+ // Get rid of the overlay data
+ var ctx = this.canvas_.getContext("2d");
+ ctx.clearRect(0, 0, this.width_, this.height_);
+ this.attr_("labelsDiv").innerHTML = "";
+ }
};
Dygraph.zeropad = function(x) {
return zeropad(d.getHours()) + ":" +
zeropad(d.getMinutes()) + ":" +
zeropad(d.getSeconds());
- } else if (d.getMinutes()) {
- return zeropad(d.getHours()) + ":" + zeropad(d.getMinutes());
} else {
- return zeropad(d.getHours());
+ return zeropad(d.getHours()) + ":" + zeropad(d.getMinutes());
}
}
this.setColors_();
this.attrs_['pointSize'] = 0.5 * this.attr_('highlightCircleSize');
+ // For stacked series.
+ var cumulative_y = [];
+ var stacked_datasets = [];
+
// Loop over all fields in the dataset
+
for (var i = 1; i < data[0].length; i++) {
if (!this.visibility()[i - 1]) continue;
var high= this.dateWindow_[1];
var pruned = [];
for (var k = 0; k < series.length; k++) {
- if (series[k][0] >= low && series[k][0] <= high) {
+ // if (series[k][0] >= low && series[k][0] <= high) {
pruned.push(series[k]);
- }
+ // }
}
series = pruned;
}
vals[j] = [series[j][0],
series[j][1][0], series[j][1][1], series[j][1][2]];
this.layout_.addDataset(this.attr_("labels")[i], vals);
+ } else if (this.attr_("stackedGraph")) {
+ var vals = [];
+ var l = series.length;
+ var actual_y;
+ for (var j = 0; j < l; j++) {
+ if (cumulative_y[series[j][0]] === undefined)
+ cumulative_y[series[j][0]] = 0;
+
+ actual_y = series[j][1];
+ cumulative_y[series[j][0]] += actual_y;
+
+ vals[j] = [series[j][0], cumulative_y[series[j][0]]]
+
+ if (!maxY || cumulative_y[series[j][0]] > maxY)
+ maxY = cumulative_y[series[j][0]];
+ }
+ stacked_datasets.push([this.attr_("labels")[i], vals]);
+ //this.layout_.addDataset(this.attr_("labels")[i], vals);
} else {
this.layout_.addDataset(this.attr_("labels")[i], series);
}
}
+ if (stacked_datasets.length > 0) {
+ for (var i = (stacked_datasets.length - 1); i >= 0; i--) {
+ this.layout_.addDataset(stacked_datasets[i][0], stacked_datasets[i][1]);
+ }
+ }
+
// Use some heuristics to come up with a good maxY value, unless it's been
// set explicitly by the user.
if (this.valueRange_ != null) {
Dygraph.dateParser = function(dateStr, self) {
var dateStrSlashed;
var d;
- if (dateStr.length == 10 && dateStr.search("-") != -1) { // e.g. '2009-07-12'
+ if (dateStr.search("-") != -1) { // e.g. '2009-7-12' or '2009-07-12'
dateStrSlashed = dateStr.replace("-", "/", "g");
while (dateStrSlashed.search("-") != -1) {
dateStrSlashed = dateStrSlashed.replace("-", "/");
projects / dygraphs.git / blobdiff