X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=dygraph-canvas.js;h=bf04e13d406097daf51446cc72a26fe974a3853a;hb=4755f0aceeff06d2a305e8f18cc8c26c8b1ba59f;hp=1947ccd6206723c0882cf3983ffde1f22d59b008;hpb=ce5e8d36fbecd1bc1811dc31091c9c9cf725d571;p=dygraphs.git diff --git a/dygraph-canvas.js b/dygraph-canvas.js index 1947ccd..bf04e13 100644 --- a/dygraph-canvas.js +++ b/dygraph-canvas.js @@ -30,26 +30,25 @@ DygraphLayout.prototype.addDataset = function(setname, set_xy) { this.datasets[setname] = set_xy; }; -// TODO(danvk): CONTRACT remove DygraphLayout.prototype.setAnnotations = function(ann) { // The Dygraph object's annotations aren't parsed. We parse them here and // save a copy. var parse = this.attr_('xValueParser'); for (var i = 0; i < ann.length; i++) { var a = {}; - if (!ann[i].x) { + if (!ann[i].xval && !ann[i].x) { this.dygraph_.error("Annotations must have an 'x' property"); return; } if (ann[i].icon && - !(ann[i].hasOwnProperty('iconWidth') && - ann[i].hasOwnProperty('iconHeight'))) { - this.dygraph_.error("Must set iconWidth and iconHeight when setting " + + !(ann[i].hasOwnProperty('width') && + ann[i].hasOwnProperty('height'))) { + this.dygraph_.error("Must set width and height when setting " + "annotation.icon property"); return; } Dygraph.update(a, ann[i]); - a.xval = parse(a.x); + if (!a.xval) a.xval = parse(a.x); this.annotations.push(a); } }; @@ -203,6 +202,35 @@ DygraphLayout.prototype.updateOptions = function(new_options) { Dygraph.update(this.options, new_options ? new_options : {}); }; +/** + * Return a copy of the point at the indicated index, with its yval unstacked. + * @param int index of point in layout_.points + */ +DygraphLayout.prototype.unstackPointAtIndex = function(idx) { + var point = this.points[idx]; + + // Clone the point since we modify it + var unstackedPoint = {}; + for (var i in point) { + unstackedPoint[i] = point[i]; + } + + if (!this.attr_("stackedGraph")) { + return unstackedPoint; + } + + // The unstacked yval is equal to the current yval minus the yval of the + // next point at the same xval. + for (var i = idx+1; i < this.points.length; i++) { + if (this.points[i].xval == point.xval) { + unstackedPoint.yval -= this.points[i].yval; + break; + } + } + + return unstackedPoint; +} + // Subclass PlotKit.CanvasRenderer to add: // 1. X/Y grid overlay // 2. Ability to draw error bars (if required) @@ -502,7 +530,7 @@ DygraphCanvasRenderer.prototype._renderAnnotations = function() { "position": "absolute", "fontSize": this.options.axisLabelFontSize + "px", "zIndex": 10, - "overflow": "hidden", + "overflow": "hidden" }; var bindEvt = function(eventName, classEventName, p, self) { @@ -520,6 +548,10 @@ DygraphCanvasRenderer.prototype._renderAnnotations = function() { var points = this.layout.annotated_points; for (var i = 0; i < points.length; i++) { var p = points[i]; + if (p.canvasx < this.area.x || p.canvasx > this.area.x + this.area.w) { + continue; + } + var a = p.annotation; var tick_height = 6; if (a.hasOwnProperty("tickHeight")) { @@ -539,24 +571,29 @@ DygraphCanvasRenderer.prototype._renderAnnotations = function() { div.className += " " + a.cssClass; } - var width = a.hasOwnProperty('height') ? a.height : 20; - var height = a.hasOwnProperty('width') ? a.width : 16; + var width = a.hasOwnProperty('width') ? a.width : 16; + var height = a.hasOwnProperty('height') ? a.height : 16; if (a.hasOwnProperty('icon')) { var img = document.createElement("img"); img.src = a.icon; - img.width = width = a.iconWidth; - img.height = height = a.iconHeight; + img.width = width; + img.height = height; div.appendChild(img); } else if (p.annotation.hasOwnProperty('shortText')) { div.appendChild(document.createTextNode(p.annotation.shortText)); } div.style.left = (p.canvasx - width / 2) + "px"; - div.style.top = (p.canvasy - height - tick_height) + "px"; + if (a.attachAtBottom) { + div.style.top = (this.area.h - height - tick_height) + "px"; + } else { + div.style.top = (p.canvasy - height - tick_height) + "px"; + } div.style.width = width + "px"; div.style.height = height + "px"; div.title = p.annotation.text; div.style.color = this.colors[p.name]; div.style.borderColor = this.colors[p.name]; + a.div = div; Dygraph.addEvent(div, 'click', bindEvt('clickHandler', 'annotationClickHandler', p, this)); @@ -573,8 +610,13 @@ DygraphCanvasRenderer.prototype._renderAnnotations = function() { var ctx = this.element.getContext("2d"); ctx.strokeStyle = this.colors[p.name]; ctx.beginPath(); - ctx.moveTo(p.canvasx, p.canvasy); - ctx.lineTo(p.canvasx, p.canvasy - 2 - tick_height); + if (!a.attachAtBottom) { + ctx.moveTo(p.canvasx, p.canvasy); + ctx.lineTo(p.canvasx, p.canvasy - 2 - tick_height); + } else { + ctx.moveTo(p.canvasx, this.area.h); + ctx.lineTo(p.canvasx, this.area.h - 2 - tick_height); + } ctx.closePath(); ctx.stroke(); } @@ -742,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]; @@ -766,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) {