-
Notifications
You must be signed in to change notification settings - Fork 10
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
3 changed files
with
93 additions
and
100 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,9 +1,9 @@ | ||
module.exports = function (kibana) { | ||
export default function (kibana) { | ||
return new kibana.Plugin({ | ||
uiExports: { | ||
visTypes: [ | ||
'plugins/health_metric_vis/health_metric_vis' | ||
] | ||
} | ||
}); | ||
}; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,55 +1,49 @@ | ||
/* jshint esversion: 6 */ | ||
import 'plugins/health_metric_vis/health_metric_vis.less'; | ||
import 'plugins/health_metric_vis/health_metric_vis_controller'; | ||
import TemplateVisTypeTemplateVisTypeProvider from 'ui/template_vis_type/template_vis_type'; | ||
import VisSchemasProvider from 'ui/vis/schemas'; | ||
|
||
define(function (require) { | ||
// we need to load the css ourselves | ||
require('plugins/health_metric_vis/health_metric_vis.less'); | ||
|
||
// we also need to load the controller and used by the template | ||
require('plugins/health_metric_vis/health_metric_vis_controller'); | ||
require('ui/registry/vis_types').register(HealthMetricVisProvider); | ||
|
||
// register the provider with the visTypes registry | ||
require('ui/registry/vis_types').register(HealthMetricVisProvider); | ||
function HealthMetricVisProvider(Private) { | ||
const TemplateVisType = Private(TemplateVisTypeTemplateVisTypeProvider); | ||
const Schemas = Private(VisSchemasProvider); | ||
|
||
function HealthMetricVisProvider(Private) { | ||
const TemplateVisType = Private(require('ui/template_vis_type/TemplateVisType')); | ||
const Schemas = Private(require('ui/Vis/Schemas')); | ||
|
||
// return the visType object, which kibana will use to display and configure new | ||
// Vis object of this type. | ||
return new TemplateVisType({ | ||
name: 'health-metric', | ||
title: 'Health Metric', | ||
description: 'A numeric health metric, can show a number and color it accordingly.', | ||
icon: 'fa-calculator', | ||
template: require('plugins/health_metric_vis/health_metric_vis.html'), | ||
params: { | ||
defaults: { | ||
handleNoResults: true, | ||
fontSize: 60, | ||
invertScale: false, | ||
redThreshold: 0, | ||
greenThreshold: 0, | ||
redColor: "#fd482f", | ||
yellowColor: "#ffa500", | ||
greenColor: "#6dc066" | ||
}, | ||
editor: require('plugins/health_metric_vis/health_metric_vis_params.html') | ||
// return the visType object, which kibana will use to display and configure new | ||
// Vis object of this type. | ||
return new TemplateVisType({ | ||
name: 'health-metric', | ||
title: 'Health Metric', | ||
description: 'A numeric health metric, can show a number and color it accordingly.', | ||
icon: 'fa-calculator', | ||
template: require('plugins/health_metric_vis/health_metric_vis.html'), | ||
params: { | ||
defaults: { | ||
handleNoResults: true, | ||
fontSize: 60, | ||
invertScale: false, | ||
redThreshold: 0, | ||
greenThreshold: 0, | ||
redColor: "#fd482f", | ||
yellowColor: "#ffa500", | ||
greenColor: "#6dc066" | ||
}, | ||
schemas: new Schemas([ | ||
{ | ||
group: 'metrics', | ||
name: 'metric', | ||
title: 'Metric', | ||
min: 1, | ||
max: 1, | ||
defaults: [ | ||
{ type: 'count', schema: 'metric' } | ||
] | ||
} | ||
]) | ||
}); | ||
} | ||
editor: require('plugins/health_metric_vis/health_metric_vis_params.html') | ||
}, | ||
schemas: new Schemas([ | ||
{ | ||
group: 'metrics', | ||
name: 'metric', | ||
title: 'Metric', | ||
min: 1, | ||
max: 1, | ||
defaults: [ | ||
{ type: 'count', schema: 'metric' } | ||
] | ||
} | ||
]) | ||
}); | ||
} | ||
|
||
// export the provider so that the visType can be required with Private() | ||
return HealthMetricVisProvider; | ||
}); | ||
export default HealthMetricVisProvider; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,65 +1,64 @@ | ||
/* jshint esversion: 6 */ | ||
import _ from 'lodash'; | ||
import AggResponseTabifyTabifyProvider from 'ui/agg_response/tabify/tabify'; | ||
import uiModules from 'ui/modules'; | ||
|
||
define(function (require) { | ||
let _ = require('lodash'); | ||
const module = require('ui/modules').get('health_metric_vis'); | ||
const module = uiModules.get('kibana/health_metric_vis', ['kibana']); | ||
|
||
module.controller('KbnHealthMetricVisController', function ($scope, Private) { | ||
const tabifyAggResponse = Private(require('ui/agg_response/tabify/tabify')); | ||
module.controller('KbnHealthMetricVisController', function ($scope, Private) { | ||
const tabifyAggResponse = Private(AggResponseTabifyTabifyProvider); | ||
|
||
const metrics = $scope.metrics = []; | ||
const metrics = $scope.metrics = []; | ||
|
||
function isInvalid(val) { | ||
return _.isUndefined(val) || _.isNull(val) || _.isNaN(val); | ||
function isInvalid(val) { | ||
return _.isUndefined(val) || _.isNull(val) || _.isNaN(val); | ||
} | ||
|
||
function getColor(val, visParams) { | ||
if (!visParams.invertScale) { | ||
if (val <= visParams.redThreshold) { | ||
return visParams.redColor; | ||
} | ||
else if (val < visParams.greenThreshold) { | ||
return visParams.yellowColor; | ||
} | ||
else { | ||
return visParams.greenColor; | ||
} | ||
} | ||
|
||
function getColor(val, visParams) { | ||
if (!visParams.invertScale) { | ||
if (val <= visParams.redThreshold) { | ||
return visParams.redColor; | ||
else { | ||
if (val <= visParams.greenThreshold) { | ||
return visParams.greenColor; | ||
} | ||
else if (val < visParams.greenThreshold) { | ||
return visParams.yellowColor; | ||
else if (val < visParams.redThreshold) { | ||
return visParams.yellowColor; | ||
} | ||
else { | ||
return visParams.greenColor; | ||
return visParams.redColor; | ||
} | ||
} | ||
else { | ||
if (val <= visParams.greenThreshold) { | ||
return visParams.greenColor; | ||
} | ||
else if (val < visParams.redThreshold) { | ||
return visParams.yellowColor; | ||
} | ||
else { | ||
return visParams.redColor; | ||
} | ||
} | ||
} | ||
} | ||
|
||
$scope.processTableGroups = function (tableGroups) { | ||
tableGroups.tables.forEach(function (table) { | ||
table.columns.forEach(function (column, i) { | ||
const fieldFormatter = table.aggConfig(column).fieldFormatter(); | ||
let value = table.rows[0][i]; | ||
let formattedValue = isInvalid(value) ? '?' : fieldFormatter(value); | ||
let color = getColor(value, $scope.vis.params); | ||
|
||
metrics.push({ | ||
label: column.title, | ||
formattedValue: formattedValue, | ||
color: color | ||
}); | ||
$scope.processTableGroups = function (tableGroups) { | ||
tableGroups.tables.forEach(function (table) { | ||
table.columns.forEach(function (column, i) { | ||
const fieldFormatter = table.aggConfig(column).fieldFormatter(); | ||
let value = table.rows[0][i]; | ||
let formattedValue = isInvalid(value) ? '?' : fieldFormatter(value); | ||
let color = getColor(value, $scope.vis.params); | ||
|
||
metrics.push({ | ||
label: column.title, | ||
formattedValue: formattedValue, | ||
color: color | ||
}); | ||
}); | ||
}; | ||
|
||
$scope.$watch('esResponse', function (resp) { | ||
if (resp) { | ||
metrics.length = 0; | ||
$scope.processTableGroups(tabifyAggResponse($scope.vis, resp)); | ||
} | ||
}); | ||
}; | ||
|
||
$scope.$watch('esResponse', function (resp) { | ||
if (resp) { | ||
metrics.length = 0; | ||
$scope.processTableGroups(tabifyAggResponse($scope.vis, resp)); | ||
} | ||
}); | ||
}); |