Merge pull request #15 from flant/fix_render

Fix panel rendering timeout
This commit is contained in:
Ivan Mikheykin
2018-10-18 14:21:46 +03:00
committed by GitHub
7 changed files with 15 additions and 11 deletions
+2 -1
View File
@@ -1,7 +1,8 @@
# Statusmap panel for Grafana
![Statusmap sample panel](https://raw.githubusercontent.com/flant/grafana-statusmap/master/src/img/flant-statusmap-panel.png)
(https://raw.githubusercontent.com/flant/grafana-statusmap/master/src/img/flant-statusmap-panel-dark.png)
![Statusmap sample panel with dark theme](https://raw.githubusercontent.com/flant/grafana-statusmap/master/src/img/flant-statusmap-panel-dark.png)
## Features
+2 -2
View File
@@ -1,13 +1,13 @@
'use strict';
System.register(['app/plugins/sdk', './color_legend', './status_heatmap_ctrl'], function (_export, _context) {
System.register(['app/plugins/sdk', './status_heatmap_ctrl'], function (_export, _context) {
"use strict";
var loadPluginCss, StatusHeatmapCtrl;
return {
setters: [function (_appPluginsSdk) {
loadPluginCss = _appPluginsSdk.loadPluginCss;
}, function (_color_legend) {}, function (_status_heatmap_ctrl) {
}, function (_status_heatmap_ctrl) {
StatusHeatmapCtrl = _status_heatmap_ctrl.StatusHeatmapCtrl;
}],
execute: function () {
+1 -1
View File
@@ -1 +1 @@
{"version":3,"sources":["../src/module.js"],"names":["loadPluginCss","StatusHeatmapCtrl","dark","light"],"mappings":";;;;;;;;AAAQA,mB,kBAAAA,a;;AAECC,uB,wBAAAA,iB;;;;AAETD,oBAAc;AACZE,cAAM,sDADM;AAEZC,eAAO;AAFK,OAAd;;2BAOEF,iB","file":"module.js","sourcesContent":["import {loadPluginCss} from 'app/plugins/sdk';\nimport './color_legend';\nimport { StatusHeatmapCtrl } from './status_heatmap_ctrl';\n\nloadPluginCss({\n dark: 'plugins/flant-statusmap-panel/css/statusmap.dark.css',\n light: 'plugins/flant-statusmap-panel/css/statusmap.light.css'\n});\n\n\nexport {\n StatusHeatmapCtrl as PanelCtrl\n};\n"]}
{"version":3,"sources":["../src/module.js"],"names":["loadPluginCss","StatusHeatmapCtrl","dark","light"],"mappings":";;;;;;;;AAAQA,mB,kBAAAA,a;;AACCC,uB,wBAAAA,iB;;;;AAETD,oBAAc;AACZE,cAAM,sDADM;AAEZC,eAAO;AAFK,OAAd;;2BAMEF,iB","file":"module.js","sourcesContent":["import {loadPluginCss} from 'app/plugins/sdk';\nimport { StatusHeatmapCtrl } from './status_heatmap_ctrl';\n\nloadPluginCss({\n dark: 'plugins/flant-statusmap-panel/css/statusmap.dark.css',\n light: 'plugins/flant-statusmap-panel/css/statusmap.light.css'\n});\n\nexport {\n StatusHeatmapCtrl as PanelCtrl\n};\n"]}
+5 -3
View File
@@ -1,6 +1,6 @@
'use strict';
System.register(['app/plugins/sdk', 'lodash', 'app/core/core', 'app/core/utils/kbn', './rendering', './options_editor', './color_mode_discrete'], function (_export, _context) {
System.register(['app/plugins/sdk', 'lodash', 'app/core/core', 'app/core/utils/kbn', './color_legend', './rendering', './options_editor', './color_mode_discrete'], function (_export, _context) {
"use strict";
var MetricsPanelCtrl, _, contextSrv, kbn, rendering, statusHeatmapOptionsEditor, ColorModeDiscrete, CANVAS, SVG, VALUE_INDEX, TIME_INDEX, panelDefaults, renderer, colorSchemes, colorModes, opacityScales, StatusHeatmapCtrl;
@@ -44,7 +44,7 @@ System.register(['app/plugins/sdk', 'lodash', 'app/core/core', 'app/core/utils/k
contextSrv = _appCoreCore.contextSrv;
}, function (_appCoreUtilsKbn) {
kbn = _appCoreUtilsKbn.default;
}, function (_rendering) {
}, function (_color_legend) {}, function (_rendering) {
rendering = _rendering.default;
}, function (_options_editor) {
statusHeatmapOptionsEditor = _options_editor.statusHeatmapOptionsEditor;
@@ -109,7 +109,7 @@ System.register(['app/plugins/sdk', 'lodash', 'app/core/core', 'app/core/utils/k
{ name: 'Blues', value: 'interpolateBlues', invert: 'dark' }, { name: 'Greens', value: 'interpolateGreens', invert: 'dark' }, { name: 'Greys', value: 'interpolateGreys', invert: 'dark' }, { name: 'Oranges', value: 'interpolateOranges', invert: 'dark' }, { name: 'Purples', value: 'interpolatePurples', invert: 'dark' }, { name: 'Reds', value: 'interpolateReds', invert: 'dark' },
// Sequential (Multi-Hue)
{ name: 'BuGn', value: 'interpolateBuGn', invert: 'dark' }, { name: 'BuPu', value: 'interpolateBuPu', invert: 'dark' }, { name: 'GnBu', value: 'interpolateGnBu', invert: 'dark' }, { name: 'OrRd', value: 'interpolateOrRd', invert: 'dark' }, { name: 'PuBuGn', value: 'interpolatePuBuGn', invert: 'dark' }, { name: 'PuBu', value: 'interpolatePuBu', invert: 'dark' }, { name: 'PuRd', value: 'interpolatePuRd', invert: 'dark' }, { name: 'RdPu', value: 'interpolateRdPu', invert: 'dark' }, { name: 'YlGnBu', value: 'interpolateYlGnBu', invert: 'dark' }, { name: 'YlGn', value: 'interpolateYlGn', invert: 'dark' }, { name: 'YlOrBr', value: 'interpolateYlOrBr', invert: 'dark' }, { name: 'YlOrRd', value: 'interpolateYlOrRd', invert: 'darm' }];
{ name: 'BuGn', value: 'interpolateBuGn', invert: 'dark' }, { name: 'BuPu', value: 'interpolateBuPu', invert: 'dark' }, { name: 'GnBu', value: 'interpolateGnBu', invert: 'dark' }, { name: 'OrRd', value: 'interpolateOrRd', invert: 'dark' }, { name: 'PuBuGn', value: 'interpolatePuBuGn', invert: 'dark' }, { name: 'PuBu', value: 'interpolatePuBu', invert: 'dark' }, { name: 'PuRd', value: 'interpolatePuRd', invert: 'dark' }, { name: 'RdPu', value: 'interpolateRdPu', invert: 'dark' }, { name: 'YlGnBu', value: 'interpolateYlGnBu', invert: 'dark' }, { name: 'YlGn', value: 'interpolateYlGn', invert: 'dark' }, { name: 'YlOrBr', value: 'interpolateYlOrBr', invert: 'dark' }, { name: 'YlOrRd', value: 'interpolateYlOrRd', invert: 'dark' }];
colorModes = ['opacity', 'spectrum', 'discrete'];
opacityScales = ['linear', 'sqrt'];
@@ -123,6 +123,7 @@ System.register(['app/plugins/sdk', 'lodash', 'app/core/core', 'app/core/utils/k
_this.onRenderComplete = function (data) {
_this.graph.chartWidth = data.chartWidth;
_this.renderingCompleted();
};
_this.calculateInterval = function () {
@@ -344,6 +345,7 @@ System.register(['app/plugins/sdk', 'lodash', 'app/core/core', 'app/core/utils/k
_this.events.on('init-edit-mode', _this.onInitEditMode);
_this.events.on('render', _this.onRender);
_this.events.on('refresh', _this.postRefresh);
// custom event from rendering.js
_this.events.on('render-complete', _this.onRenderComplete);
return _this;
}
+1 -1
View File
File diff suppressed because one or more lines are too long
-2
View File
@@ -1,5 +1,4 @@
import {loadPluginCss} from 'app/plugins/sdk';
import './color_legend';
import { StatusHeatmapCtrl } from './status_heatmap_ctrl';
loadPluginCss({
@@ -7,7 +6,6 @@ loadPluginCss({
light: 'plugins/flant-statusmap-panel/css/statusmap.light.css'
});
export {
StatusHeatmapCtrl as PanelCtrl
};
+4 -1
View File
@@ -3,6 +3,7 @@ import _ from 'lodash';
import { contextSrv } from 'app/core/core';
import kbn from 'app/core/utils/kbn';
import './color_legend';
import rendering from './rendering';
// import aggregates, { aggregatesMap } from './aggregates';
// import fragments, { fragmentsMap } from './fragments';
@@ -88,7 +89,7 @@ const colorSchemes = [
{ name: 'YlGnBu', value: 'interpolateYlGnBu', invert: 'dark' },
{ name: 'YlGn', value: 'interpolateYlGn', invert: 'dark' },
{ name: 'YlOrBr', value: 'interpolateYlOrBr', invert: 'dark' },
{ name: 'YlOrRd', value: 'interpolateYlOrRd', invert: 'darm' }
{ name: 'YlOrRd', value: 'interpolateYlOrRd', invert: 'dark' }
];
let colorModes = ['opacity', 'spectrum', 'discrete'];
@@ -132,11 +133,13 @@ export class StatusHeatmapCtrl extends MetricsPanelCtrl {
this.events.on('init-edit-mode', this.onInitEditMode);
this.events.on('render', this.onRender);
this.events.on('refresh', this.postRefresh);
// custom event from rendering.js
this.events.on('render-complete', this.onRenderComplete);
}
onRenderComplete = (data) => {
this.graph.chartWidth = data.chartWidth;
this.renderingCompleted();
};
// override calculateInterval for discrete color mode