Dygraph.ANIMATION_STEPS = 12;
Dygraph.ANIMATION_DURATION = 200;
+// Label constants for the labelsKMB and labelsKMG2 options.
+// (i.e. '100000' -> '100K')
Dygraph.KMB_LABELS = [ 'K', 'M', 'B', 'T', 'Q' ];
Dygraph.KMG2_BIG_LABELS = [ 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y' ];
Dygraph.KMG2_SMALL_LABELS = [ 'm', 'u', 'n', 'p', 'f', 'a', 'z', 'y' ];
var m_labels = [];
if (kmb) {
k = 1000;
- k_labels = [ "K", "M", "B", "T", "Q" ];
+ k_labels = Dygraph.KMB_LABELS;
}
if (kmg2) {
if (kmb) Dygraph.warn("Setting both labelsKMB and labelsKMG2. Pick one!");
k = 1024;
- k_labels = [ "k", "M", "G", "T", "P", "E", "Z", "Y" ];
- m_labels = [ "m", "u", "n", "p", "f", "a", "z", "y" ];
+ k_labels = Dygraph.KMG2_BIG_LABELS;
+ m_labels = Dygraph.KMG2_SMALL_LABELS;
}
var absx = Math.abs(x);
var enclosing = this.maindiv_;
this.graphDiv = document.createElement("div");
- this.graphDiv.style.width = this.width_ + "px";
- this.graphDiv.style.height = this.height_ + "px";
+
// TODO(danvk): any other styles that are useful to set here?
this.graphDiv.style.textAlign = 'left'; // This is a CSS "reset"
enclosing.appendChild(this.graphDiv);
// Create the canvas for interactive parts of the chart.
this.canvas_ = Dygraph.createCanvas();
this.canvas_.style.position = "absolute";
- this.canvas_.width = this.width_;
- this.canvas_.height = this.height_;
- this.canvas_.style.width = this.width_ + "px"; // for IE
- this.canvas_.style.height = this.height_ + "px"; // for IE
+
+ this.resizeElements_();
this.canvas_ctx_ = Dygraph.getContext(this.canvas_);
}
};
- this.addEvent(window, 'mouseout', this.mouseOutHandler_);
- this.addEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler_);
+ this.addAndTrackEvent(window, 'mouseout', this.mouseOutHandler_);
+ this.addAndTrackEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler_);
// Don't recreate and register the resize handler on subsequent calls.
// This happens when the graph is resized.
// Update when the window is resized.
// TODO(danvk): drop frames depending on complexity of the chart.
- this.addEvent(window, 'resize', this.resizeHandler_);
+ this.addAndTrackEvent(window, 'resize', this.resizeHandler_);
}
};
+Dygraph.prototype.resizeElements_ = function() {
+ this.graphDiv.style.width = this.width_ + "px";
+ this.graphDiv.style.height = this.height_ + "px";
+ this.canvas_.width = this.width_;
+ this.canvas_.height = this.height_;
+ this.canvas_.style.width = this.width_ + "px"; // for IE
+ this.canvas_.style.height = this.height_ + "px"; // for IE
+}
+
/**
* Detach DOM elements in the dygraph and null out all data references.
* Calling this when you're done with a dygraph can dramatically reduce memory
* usage. See, e.g., the tests/perf.html example.
*/
Dygraph.prototype.destroy = function() {
+ this.canvas_ctx_.restore();
+ this.hidden_ctx_.restore();
+
var removeRecursive = function(node) {
while (node.hasChildNodes()) {
removeRecursive(node.firstChild);
}
};
- if (this.registeredEvents_) {
- for (var idx = 0; idx < this.registeredEvents_.length; idx++) {
- var reg = this.registeredEvents_[idx];
- Dygraph.removeEvent(reg.elem, reg.type, reg.fn);
- }
- }
-
- this.registeredEvents_ = [];
+ this.removeTrackedEvents_();
// remove mouse event handlers (This may not be necessary anymore)
Dygraph.removeEvent(window, 'mouseout', this.mouseOutHandler_);
Dygraph.removeEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler_);
- Dygraph.removeEvent(this.mouseEventElement_, 'mouseup', this.mouseUpHandler_);
// remove window handlers
Dygraph.removeEvent(window,'resize',this.resizeHandler_);
for (var eventName in interactionModel) {
if (!interactionModel.hasOwnProperty(eventName)) continue;
- this.addEvent(this.mouseEventElement_, eventName,
+ this.addAndTrackEvent(this.mouseEventElement_, eventName,
bindHandler(interactionModel[eventName]));
}
- // unregister the handler on subsequent calls.
- // This happens when the graph is resized.
- if (this.mouseUpHandler_) {
- Dygraph.removeEvent(document, 'mouseup', this.mouseUpHandler_);
- }
-
// If the user releases the mouse button during a drag, but not over the
// canvas, then it doesn't count as a zooming action.
- this.mouseUpHandler_ = function(event) {
+ var mouseUpHandler = function(event) {
if (context.isZooming || context.isPanning) {
context.isZooming = false;
context.dragStartX = null;
context.tarp.uncover();
};
- this.addEvent(document, 'mouseup', this.mouseUpHandler_);
+ this.addAndTrackEvent(document, 'mouseup', this.mouseUpHandler);
};
/**
var callback = this.attr_("highlightCallback");
if (callback && selectionChanged) {
- callback(event, this.lastx_, this.selPoints_, this.lastRow_, this.highlightSet_);
+ callback(event,
+ this.lastx_,
+ this.selPoints_,
+ this.lastRow_ + this.getLeftBoundary_(),
+ this.highlightSet_);
}
};
this.cascadeEvents_('clearChart');
this.plotter_.clear();
}
+
+ if(!this.is_initial_draw_) {
+ this.canvas_ctx_.restore();
+ this.hidden_ctx_.restore();
+ }
+
+ this.canvas_ctx_.save();
+ this.hidden_ctx_.save();
+
this.plotter_ = new DygraphCanvasRenderer(this,
this.hidden_,
this.hidden_ctx_,
series[j][1][2]];
}
} else if (this.attr_("stackedGraph")) {
- var actual_y, last_x;
+ // Need to clear last_x explicitly as javascript's locals are
+ // local to function, not to a block of statements
+ var actual_y, last_x = null;
for (j = 0; j < series.length; j++) {
// If one data set has a NaN, let all subsequent stacked
// sets inherit the NaN -- only start at 0 for the first set.
continue;
}
- if (j === 0 || last_x != x) {
+ if (last_x != x) {
cumulative_y[x] += actual_y;
// If an x-value is repeated, we ignore the duplicates.
}
this.cascadeEvents_('willDrawChart', e);
this.plotter_.render();
this.cascadeEvents_('didDrawChart', e);
+ this.lastRow_ = -1; // because plugins/legend.js clears the legend
// TODO(danvk): is this a performance bottleneck when panning?
// The interaction canvas should already be empty in that situation.
if (valueWindows !== undefined) {
// Restore valueWindow settings.
- for (index = 0; index < valueWindows.length; index++) {
+
+ // When going from two axes back to one, we only restore
+ // one axis.
+ var idxCount = Math.min(valueWindows.length, this.axes_.length);
+
+ for (index = 0; index < idxCount; index++) {
this.axes_[index].valueWindow = valueWindows[index];
}
}
var includeZero = this.attributes_.getForAxis("includeZero", i);
series = this.attributes_.seriesForAxis(i);
+ // Add some padding. This supports two Y padding operation modes:
+ //
+ // - backwards compatible (yRangePad not set):
+ // 10% padding for automatic Y ranges, but not for user-supplied
+ // ranges, and move a close-to-zero edge to zero except if
+ // avoidMinZero is set, since drawing at the edge results in
+ // invisible lines. Unfortunately lines drawn at the edge of a
+ // user-supplied range will still be invisible. If logscale is
+ // set, add a variable amount of padding at the top but
+ // none at the bottom.
+ //
+ // - new-style (yRangePad set by the user):
+ // always add the specified Y padding.
+ //
+ ypadCompat = true;
+ ypad = 0.1; // add 10%
+ if (this.attr_('yRangePad') !== null) {
+ ypadCompat = false;
+ // Convert pixel padding to ratio
+ ypad = this.attr_('yRangePad') / this.plotter_.area.h;
+ }
+
if (series.length === 0) {
// If no series are defined or visible then use a reasonable default
axis.extremeRange = [0, 1];
}
}
- // Add some padding. This supports two Y padding operation modes:
- //
- // - backwards compatible (yRangePad not set):
- // 10% padding for automatic Y ranges, but not for user-supplied
- // ranges, and move a close-to-zero edge to zero except if
- // avoidMinZero is set, since drawing at the edge results in
- // invisible lines. Unfortunately lines drawn at the edge of a
- // user-supplied range will still be invisible. If logscale is
- // set, add a variable amount of padding at the top but
- // none at the bottom.
- //
- // - new-style (yRangePad set by the user):
- // always add the specified Y padding.
- //
- ypadCompat = true;
- ypad = 0.1; // add 10%
- if (this.attr_('yRangePad') !== null) {
- ypadCompat = false;
- // Convert pixel padding to ratio
- ypad = this.attr_('yRangePad') / this.plotter_.area.h;
- }
-
var maxAxisY, minAxisY;
if (logscale) {
if (ypadCompat) {
rollingData[i] = [originalData[i][0],
[sum / num_ok, sigma * stddev, sigma * stddev]];
} else {
- rollingData[i] = [originalData[i][0], [null, null, null]];
+ // This explicitly preserves NaNs to aid with "independent series".
+ // See testRollingAveragePreservesNaNs.
+ var v = (rollPeriod == 1) ? originalData[i][1][0] : null;
+ rollingData[i] = [originalData[i][0], [v, v, v]];
}
}
}
this.height_ = this.maindiv_.clientHeight;
}
+ this.resizeElements_();
+
if (old_width != this.width_ || old_height != this.height_) {
- // TODO(danvk): there should be a clear() method.
- this.maindiv_.innerHTML = "";
- this.roller_ = null;
- this.attrs_.labelsDiv = null;
- this.createInterface_();
- if (this.annotations_.length) {
- // createInterface_ reset the layout, so we need to do this.
- this.layout_.setAnnotations(this.annotations_);
- }
- this.createDragInterface_();
this.predraw_();
}
// Only add the annotation CSS rule once we know it will be used.
Dygraph.addAnnotationRule();
this.annotations_ = ann;
+ if (!this.layout_) {
+ this.warn("Tried to setAnnotations before dygraph was ready. " +
+ "Try setting them in a drawCallback. See " +
+ "dygraphs.com/tests/annotation.html");
+ return;
+ }
+
this.layout_.setAnnotations(this.annotations_);
if (!suppressDraw) {
this.predraw_();