Graph Panel: Legend in table mode now aligns, graph area is reduced depending on how many series, Fixes #1786, Fixes #1749

CHANGELOG.md

@@ -1,6 +1,8 @@
 # 2.0.0 (unreleased)
 
 **Fixes**
+- [Issue #1749](https://github.com/grafana/grafana/issues/1749). Graph Panel: Table legends are now visible when rendered to PNG
+- [Issue #1786](https://github.com/grafana/grafana/issues/1786). Graph Panel: Legend in table mode now aligns, graph area is reduced depending on how many series
 - [Issue #1734](https://github.com/grafana/grafana/issues/1734). Support for unicode / international characters in dashboard title (improved slugify)
 - [Issue #1782](https://github.com/grafana/grafana/issues/1782). Github OAuth: Now works with Github for Enterprise, thanks @williamjoy
 - [Issue #1780](https://github.com/grafana/grafana/issues/1780). Dashboard snapshot: Should not require login to view snapshot, Fixes #1780

public/app/panels/graph/graph.js

@@ -63,6 +63,17 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
           render_panel();
         });
 
+        function getLegendHeight() {
+          if (!scope.panel.legend.show || scope.panel.legend.rightSide) {
+            return 0;
+          }
+          if (scope.panel.legend.alignAsTable) {
+            return 30 + (25 * data.length);
+          } else {
+            return 26;
+          }
+        }
+
         function setElementHeight() {
           try {
             graphHeight = scope.height || scope.panel.height || scope.row.height;
@@ -73,9 +84,7 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
             graphHeight -= 5; // padding
             graphHeight -= scope.panel.title ? 24 : 9; // subtract panel title bar
 
-            if (scope.panel.legend.show && !scope.panel.legend.rightSide) {
-              graphHeight = graphHeight - 26; // subtract one line legend
-            }
+            graphHeight = graphHeight - getLegendHeight(); // subtract one line legend
 
             elem.css('height', graphHeight + 'px');
 

public/css/less/graph.less

@@ -79,7 +79,6 @@
     white-space: nowrap;
     padding: 2px 10px;
     text-align: right;
-    border-bottom: 1px solid @grafanaListBorderBottom;
   }
 
   .graph-legend-icon {