Chris Leonello avatar Chris Leonello committed 4efc1d5

Fixes to legend renderer for correct positioning.
Changed default legend position to ne.

Comments (0)

Files changed (1)

         this.show = true;
         // prop: location
         // Placement of the legend.  one of the compas directions: nw, n, ne, e, se, s, sw, w
-        this.location = 'se';
+        this.location = 'ne';
         // prop: xoffset
         // offset from the inside edge of the plot in the x direction in pixels.
         this.xoffset = 12;
         return this.renderer.draw.call(this, offsets);
     };
     
-    Legend.prototype.set = function() {
-        this.renderer.set.call(this);
+    Legend.prototype.pack = function(offsets) {
+        this.renderer.pack.call(this, offsets);
     };
     
     $.jqplot.TableLegendRenderer = function(){
         $.extend(true, this, options);
     }
     
-    $.jqplot.TableLegendRenderer.prototype.draw = function(offsets) {
+    $.jqplot.TableLegendRenderer.prototype.draw = function() {
         var legend = this;
         if (this.show) {
             var series = this._series;
-            // fake a grid for positioning
-            var grid = {_top:offsets.top, _left:offsets.left, _right:this._plotDimensions.width - offsets.right, _bottom:this._plotDimensions.height - offsets.bottom}
             // make a table.  one line label per row.
             var ss = 'background:'+this.background+';border:'+this.border+';position:absolute;';
             ss += (this.fontSize) ? 'font-size:'+this.fontSize+';' : '';
             ss += (this.fontFamily) ? 'font-family:'+this.fontFamily+';' : '';
             ss += (this.textColor) ? 'color:'+this.textColor+';' : '';
-            switch (this.location) {
-                case 'nw':
-                    var a = grid._left + this.xoffset;
-                    var b = grid._top + this.yoffset;
-                    ss += 'left:'+a+'px;top:'+b+'px;';
-                    break;
-                case 'n':
-                    var a = (grid._left + grid._right)/2 + this.xoffset;
-                    var b = grid._top + this.yoffset;
-                    ss += 'left:'+a+'px;top:'+b+'px;';
-                    break;
-                case 'ne':
-                    var a = grid._right - this.xoffset;
-                    var b = grid._top + this.yoffset;
-                    ss += 'right:'+a+'px;top:'+b+'px;';
-                    break;
-                case 'e':
-                    var a = offsets.right + this.xoffset;
-                    var b = offsets.top + this.yoffset;
-                    ss += 'right:'+a+'px;top:'+b+'px;';
-                    break;
-                case 'se':
-                    var a = offsets.right + this.xoffset;
-                    var b = offsets.bottom + this.yoffset;
-                    ss += 'right:'+a+'px;bottom:'+b+'px;';
-                    break;
-                case 's':
-                    var a = (grid._left + grid._right)/2 + this.xoffset;
-                    var b = grid._bottom + this.yoffset;
-                    ss += 'left:'+a+'px;bottom:'+b+'px;';
-                    break;
-                case 'sw':
-                    var a = grid._left + this.xoffset;
-                    var b = grid._bottom + this.yoffset;
-                    ss += 'left:'+a+'px;bottom:'+b+'px;';
-                    break;
-                case 'w':
-                    var a = grid._left + this.xoffset;
-                    var b = (grid._top + grid._bottom)/2 + this.yoffset;
-                    ss += 'left:'+a+'px;top:'+b+'px;';
-                    break;
-                default:  // same as 'se'
-                    var a = grid._right - this.xoffset;
-                    var b = grid._bottom + this.yoffset;
-                    ss += 'right:'+a+'px;bottom:'+b+'px;';
-                    break;
-                
+            this._elem = $('<table class="jqplot-legend" style="'+ss+'"></table>');
+        
+            var pad = false;
+            for (var i = 0; i< series.length; i++) {
+                s = series[i];
+                if (s.show) {
+                    var lt = s.label.toString();
+                    if (lt) {
+                        addrow.call(this, lt, s.color, pad);
+                        pad = true;
+                    }
+                    for (var j=0; j<$.jqplot.drawLegendHooks.length; j++) {
+                        var item = $.jqplot.drawLegendHooks[j].call(this, s);
+                        if (item) {
+                            addrow(item.label, item.color, pad);
+                            pad = true;
+                        } 
+                    }
+                }
             }
-            this._elem = $('<table class="jqplot-legend" style="'+ss+'"></table>');
         }
         
         function addrow(label, color, pad) {
                 '</div></td>').appendTo(tr);
             $('<td class="jqplot-legend" style="vertical-align:middle;padding-top:'+rs+';">'+label+'</td>').appendTo(tr);
         };
-        
-        var pad = false;
-        for (var i = 0; i< series.length; i++) {
-            s = series[i];
-            if (s.show) {
-                var lt = s.label.toString();
-                if (lt) {
-                    addrow.call(this, lt, s.color, pad);
-                    pad = true;
-                }
-                for (var j=0; j<$.jqplot.drawLegendHooks.length; j++) {
-                    var item = $.jqplot.drawLegendHooks[j].call(this, s);
-                    if (item) {
-                        addrow(item.label, item.color, pad);
-                        pad = true;
-                    } 
-                }
+        return this._elem;
+    };
+    
+    $.jqplot.TableLegendRenderer.prototype.pack = function(offsets) {
+        if (this.show) {
+            // fake a grid for positioning
+            var grid = {_top:offsets.top, _left:offsets.left, _right:offsets.right, _bottom:this._plotDimensions.height - offsets.bottom}        
+            switch (this.location) {
+                case 'nw':
+                    var a = grid._left + this.xoffset;
+                    var b = grid._top + this.yoffset;
+                    this._elem.css('left', a);
+                    this._elem.css('top', b);
+                    break;
+                case 'n':
+                    var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
+                    var b = grid._top + this.yoffset;
+                    this._elem.css('left', a);
+                    this._elem.css('top', b);
+                    break;
+                case 'ne':
+                    var a = offsets.right + this.xoffset;
+                    var b = grid._top + this.yoffset;
+                    this._elem.css({right:a, top:b});
+                    break;
+                case 'e':
+                    var a = offsets.right + this.xoffset;
+                    var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
+                    this._elem.css({right:a, top:b});
+                    break;
+                case 'se':
+                    var a = offsets.right + this.xoffset;
+                    var b = offsets.bottom + this.yoffset;
+                    this._elem.css({right:a, bottom:b});
+                    break;
+                case 's':
+                    var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
+                    var b = offsets.bottom + this.yoffset;
+                    this._elem.css({left:a, bottom:b});
+                    break;
+                case 'sw':
+                    var a = grid._left + this.xoffset;
+                    var b = offsets.bottom + this.yoffset;
+                    this._elem.css({left:a, bottom:b});
+                    break;
+                case 'w':
+                    var a = grid._left + this.xoffset;
+                    var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
+                    this._elem.css({left:a, top:b});
+                    break;
+                default:  // same as 'se'
+                    var a = grid._right - this.xoffset;
+                    var b = grid._bottom + this.yoffset;
+                    this._elem.css({right:a, bottom:b});
+                    break;
             }
-        }
-        return this._elem;
+        } 
     };
 
     // Class: Title
         // for dual axes, wether to space ticks the same on both sides.
         this.equalYTicks = true;
         // prop: seriesColors
-        // default colors for the series.
-        this.seriesColors = ["#edc240", "#afd8f8", "#cb4b4b", "#4da74d", "#9440ed"];
+        // default colors for the series.#c29549
+        this.seriesColors = [ "#4bb2c5", "#c5b47f", "#cba02e", "#579575", "#839557", "#958c12", "#953579"];
         this._seriesColorsIndex = 0;
         // prop textColor
         // css spec for the css color attribute.  Default for the entire plot.
             this.drawSeries(sctx);
 
             // finally, draw and pack the legend
-            this.target.append(this.legend.draw(this._gridOffsets));
+            this.target.append(this.legend.draw());
+            this.legend.pack(this._gridOffsets);
 
             // for (var i=0; i<$.jqplot.postDrawHooks.length; i++) {
             //     $.jqplot.postDrawHooks[i].call(this);
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.