X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=plugins%2Flegend.js;h=3349969b843b9b8430ba00eb200e6e1e99074e8e;hb=d6eb5c59dcbc22c942a266b57e95d3111db6fcae;hp=66408b627d97cec64cefba5b4495b5df893420be;hpb=464b5f504e75c5d2b98eff12b3b8ad520a1729cb;p=dygraphs.git
diff --git a/plugins/legend.js b/plugins/legend.js
index 66408b6..3349969 100644
--- a/plugins/legend.js
+++ b/plugins/legend.js
@@ -120,15 +120,48 @@ var calculateEmWidthInDiv = function(div) {
return oneEmWidth;
};
+var escapeHTML = function(str) {
+ return str.replace(/&/g, "&").replace(/"/g, """).replace(//g, ">");
+};
+
legend.prototype.select = function(e) {
var xValue = e.selectedX;
var points = e.selectedPoints;
+ if (e.dygraph.getOption("legendFollow")) {
+ // create floating legend div
+ var area = e.dygraph.plotter_.area;
+ var labelsDivWidth = e.dygraph.getOption("labelsDivWidth");
+ var yAxisLabelWidth = e.dygraph.getOption("yAxisLabelWidth");
+ // determine floating [left, top] coordinates of the legend div
+ // within the plotter_ area
+ // offset 20 px to the left and down from the first selection point
+ // 20 px is guess based on mouse cursor size
+ var leftLegend = points[0].x * area.w + 20;
+ var topLegend = points[0].y * area.h - 20;
+
+ // if legend floats to end of the plotting area, it flips to the other
+ // side of the selection point
+ if ((leftLegend + labelsDivWidth + 1) > (window.scrollX + window.innerWidth)) {
+ leftLegend = leftLegend - 2 * 20 - labelsDivWidth - (yAxisLabelWidth - area.x);
+ }
+
+ e.dygraph.graphDiv.appendChild(this.legend_div_);
+ this.legend_div_.style.left = yAxisLabelWidth + leftLegend + "px";
+ this.legend_div_.style.top = topLegend + "px";
+ }
+
var html = generateLegendHTML(e.dygraph, xValue, points, this.one_em_width_);
this.legend_div_.innerHTML = html;
};
legend.prototype.deselect = function(e) {
+
+ if(e.dygraph.getOption("legendFollow")) {
+ // return legend to the default non-floating position
+ this.predraw(e);
+ }
+
// Have to do this every time, since styles might have changed.
var oneEmWidth = calculateEmWidthInDiv(this.legend_div_);
this.one_em_width_ = oneEmWidth;
@@ -208,7 +241,7 @@ generateLegendHTML = function(g, x, sel_points, oneEmWidth) {
strokePattern = g.getOption("strokePattern", labels[i]);
dash = generateLegendDashHTML(strokePattern, series.color, oneEmWidth);
html += "" +
- dash + " " + labels[i] + "";
+ dash + " " + escapeHTML(labels[i]) + "";
}
return html;
}
@@ -245,7 +278,7 @@ generateLegendHTML = function(g, x, sel_points, oneEmWidth) {
// TODO(danvk): use a template string here and make it an attribute.
html += "" + " " +
- pt.name + ": " + yval + "";
+ escapeHTML(pt.name) + ": " + yval + "";
}
return html;
};