diff --git a/public/app/features/panel/panel_ctrl.ts b/public/app/features/panel/panel_ctrl.ts index 3bebf00ee90..4fe76913896 100644 --- a/public/app/features/panel/panel_ctrl.ts +++ b/public/app/features/panel/panel_ctrl.ts @@ -6,7 +6,7 @@ import Remarkable from 'remarkable'; import {GRID_CELL_HEIGHT, GRID_CELL_VMARGIN} from 'app/core/constants'; const TITLE_HEIGHT = 27; -const PANEL_BORDER = 2; +const PANEL_BORDER = 12; import {Emitter} from 'app/core/core'; @@ -62,6 +62,7 @@ export class PanelCtrl { } refresh() { + this.setPanelHeight(); this.events.emit('refresh', null); } @@ -70,6 +71,7 @@ export class PanelCtrl { } changeView(fullscreen, edit) { + this.setPanelHeight(); this.publishAppEvent('panel-change-view', { fullscreen: fullscreen, edit: edit, panelId: this.panel.id }); @@ -168,8 +170,15 @@ export class PanelCtrl { console.log(PANEL_BORDER + TITLE_HEIGHT); } + setPanelHeight() { + if (this.$scope.setPanelHeight) { + this.$scope.setPanelHeight(); + } + } + render(payload?) { this.timing.renderStart = new Date().getTime(); + this.setPanelHeight(); this.events.emit('render', payload); } diff --git a/public/app/features/panel/panel_directive.ts b/public/app/features/panel/panel_directive.ts index efaa984be9e..e48280d5eb9 100644 --- a/public/app/features/panel/panel_directive.ts +++ b/public/app/features/panel/panel_directive.ts @@ -65,6 +65,7 @@ module.directive('grafanaPanel', function($rootScope, $document) { var cornerInfoElem = elem.find('.panel-info-corner'); var ctrl = scope.ctrl; var infoDrop; + var panelScrollbar; // the reason for handling these classes this way is for performance // limit the watchers on panels etc @@ -90,13 +91,24 @@ module.directive('grafanaPanel', function($rootScope, $document) { if (ctrl.__proto__.constructor.scrollable) { panelContent.addClass('panel-content--scrollable'); - var myScrollbar = new GeminiScrollbar({ + panelScrollbar = new GeminiScrollbar({ autoshow: false, element: panelContent[0] }).create(); } } + function setPanelHeight() { + panelContent.height(ctrl.height); + if (panelScrollbar) { + panelScrollbar.update(); + } + } + + if (ctrl.__proto__.constructor.scrollable) { + ctrl.$scope.setPanelHeight = setPanelHeight; + } + // set initial transparency if (ctrl.panel.transparent) { transparentLastState = true;