X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=plugins%2Fannotations.js;h=8576104036d9e27fcce093358fc8649e48040ed4;hb=33b5c4b245bf29f3e908931bf70dde00b5fc8a51;hp=6a248949351ebcac23f6e7cbf2064d5c02379a70;hpb=960eed90ac4bc6fa3f9a41ca3db193692462c5fb;p=dygraphs.git diff --git a/plugins/annotations.js b/plugins/annotations.js index 6a24894..8576104 100644 --- a/plugins/annotations.js +++ b/plugins/annotations.js @@ -79,6 +79,10 @@ annotations.prototype.didDrawChart = function(e) { // Add the annotations one-by-one. var area = e.dygraph.plotter_.area; + + // x-coord to sum of previous annotation's heights (used for stacking). + var xToUsedHeight = {}; + for (var i = 0; i < points.length; i++) { var p = points[i]; if (p.canvasx < area.x || p.canvasx > area.x + area.w || @@ -116,12 +120,22 @@ annotations.prototype.didDrawChart = function(e) { } else if (p.annotation.hasOwnProperty('shortText')) { div.appendChild(document.createTextNode(p.annotation.shortText)); } - div.style.left = (p.canvasx - width / 2) + "px"; + var left = p.canvasx - width / 2; + div.style.left = left + "px"; + var divTop = 0; if (a.attachAtBottom) { - div.style.top = (area.h - height - tick_height) + "px"; + var y = (area.y + area.h - height - tick_height); + if (xToUsedHeight[left]) { + y -= xToUsedHeight[left]; + } else { + xToUsedHeight[left] = 0; + } + xToUsedHeight[left] += (tick_height + height); + divTop = y; } else { - div.style.top = (p.canvasy - height - tick_height) + "px"; + divTop = p.canvasy - height - tick_height; } + div.style.top = divTop + "px"; div.style.width = width + "px"; div.style.height = height + "px"; div.title = p.annotation.text; @@ -129,13 +143,13 @@ annotations.prototype.didDrawChart = function(e) { div.style.borderColor = g.colorsMap_[p.name]; a.div = div; - g.addEvent(div, 'click', + g.addAndTrackEvent(div, 'click', bindEvt('clickHandler', 'annotationClickHandler', p, this)); - g.addEvent(div, 'mouseover', + g.addAndTrackEvent(div, 'mouseover', bindEvt('mouseOverHandler', 'annotationMouseOverHandler', p, this)); - g.addEvent(div, 'mouseout', + g.addAndTrackEvent(div, 'mouseout', bindEvt('mouseOutHandler', 'annotationMouseOutHandler', p, this)); - g.addEvent(div, 'dblclick', + g.addAndTrackEvent(div, 'dblclick', bindEvt('dblClickHandler', 'annotationDblClickHandler', p, this)); containerDiv.appendChild(div); @@ -149,8 +163,9 @@ annotations.prototype.didDrawChart = function(e) { ctx.moveTo(p.canvasx, p.canvasy); ctx.lineTo(p.canvasx, p.canvasy - 2 - tick_height); } else { - ctx.moveTo(p.canvasx, area.h); - ctx.lineTo(p.canvasx, area.h - 2 - tick_height); + var y = divTop + height; + ctx.moveTo(p.canvasx, y); + ctx.lineTo(p.canvasx, y + tick_height); } ctx.closePath(); ctx.stroke();