public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'perf_graph_js' of https://github.com/mtanda/grafana into mtanda-perf_graph_js

Browse Source
This commit is contained in:
Torkel Ödegaard
2016-06-08 06:53:28 +02:00
parent e1e7fbf83d 487b2089a9
commit bf82fdb678
1 changed files with 33 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/plugins/panel/graph/graph.js
+33 -5
View File
@@ -31,6 +31,7 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
var sortedSeries;
var legendSideLastValue = null;
var rootScope = scope.$root;
var panelWidth = 0;
rootScope.onAppEvent('setCrosshair', function(event, info) {
// do not need to to this if event is from this panel
@@ -104,11 +105,28 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
return true;
}
if (elem.width() === 0) {
if (panelWidth === 0) {
return true;
}
}
function getLabelWidth(type, text, elem) {
var labelWidth = 0;
if (!rootScope.labelWidthCache) {
rootScope.labelWidthCache = {};
}
if (!rootScope.labelWidthCache[type]) {
rootScope.labelWidthCache[type] = {};
}
if (rootScope.labelWidthCache[type][text]) {
labelWidth = rootScope.labelWidthCache[type][text];
} else {
labelWidth = elem.width();
rootScope.labelWidthCache[type][text] = labelWidth;
}
return labelWidth;
}
function drawHook(plot) {
// Update legend values
var yaxis = plot.getYAxes();
@@ -137,7 +155,7 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
.text(panel.yaxes[0].label)
.appendTo(elem);
yaxisLabel.css("margin-top", yaxisLabel.width() / 2);
yaxisLabel[0].style.marginTop = (getLabelWidth('left', panel.yaxes[0].label, yaxisLabel) / 2) + 'px';
}
// add right axis labels
@@ -146,7 +164,7 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
.text(panel.yaxes[1].label)
.appendTo(elem);
rightLabel.css("margin-top", rightLabel.width() / 2);
rightLabel[0].style.marginTop = (getLabelWidth('right', panel.yaxes[1].label, rightLabel) / 2) + 'px';
}
}
@@ -159,6 +177,16 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
// Function for rendering panel
function render_panel() {
if (!rootScope.panelWidthCache) {
rootScope.panelWidthCache = {};
}
if (rootScope.panelWidthCache[panel.span]) {
panelWidth = rootScope.panelWidthCache[panel.span];
} else {
panelWidth = elem.width();
rootScope.panelWidthCache[panel.span] = panelWidth;
}
if (shouldAbortRender()) {
return;
}
@@ -276,7 +304,7 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
}
function addTimeAxis(options) {
var ticks = elem.width() / 100;
var ticks = panelWidth / 100;
var min = _.isUndefined(ctrl.range.from) ? null : ctrl.range.from.valueOf();
var max = _.isUndefined(ctrl.range.to) ? null : ctrl.range.to.valueOf();
@@ -444,7 +472,7 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
}
function render_panel_as_graphite_png(url) {
url += '&width=' + elem.width();
url += '&width=' + panelWidth;
url += '&height=' + elem.css('height').replace('px', '');
url += '&bgcolor=1f1f1f'; // @grayDarker & @grafanaPanelBackground
url += '&fgcolor=BBBFC2'; // @textColor & @grayLighter