-
Notifications
You must be signed in to change notification settings - Fork 21
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
Clamarque
committed
Nov 17, 2016
1 parent
7e74d6f
commit 9ae11e3
Showing
4 changed files
with
110 additions
and
110 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 @@ | ||
| export default function (kibana) { | ||
| module.exports = 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,4 +1,3 @@ | ||
| { | ||
| "name": "health_metric_vis", | ||
| "version": "5.0.0" | ||
| } | ||
| } |
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,54 +1,54 @@ | ||
| import 'plugins/health_metric_vis/health_metric_vis.less'; | ||
| import 'plugins/health_metric_vis/health_metric_vis_controller'; | ||
| define(function (require) { | ||
| // we need to load the css ourselves | ||
| require('plugins/health_metric_vis/health_metric_vis.less'); | ||
|
|
||
| import TemplateVisTypeTemplateVisTypeProvider from 'ui/template_vis_type/template_vis_type'; | ||
| import VisSchemasProvider from 'ui/vis/schemas'; | ||
| import healthMetricVisTemplate from 'plugins/health_metric_vis/health_metric_vis.html'; | ||
| import healthMetricVisParamsTemplate from 'plugins/health_metric_vis/health_metric_vis_params.html'; | ||
| // we also need to load the controller and used by the template | ||
| require('plugins/health_metric_vis/health_metric_vis_controller'); | ||
|
|
||
| // Register visualisation plugin | ||
| 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 Color Metric', | ||
| description: 'Displays a metric with a color according to the planned state of health.', | ||
| icon: 'fa-calculator', | ||
| template: healthMetricVisTemplate, | ||
| params: { | ||
| defaults: { | ||
| handleNoResults: true, | ||
| fontSize: 60, | ||
| fontColor: 'white', | ||
| invertScale: false, | ||
| redThreshold: 0, | ||
| yellowThreshold: 0, | ||
| redColor: "#fd482f", | ||
| yellowColor: "#ffa500", | ||
| greenColor: "#6dc066" | ||
| // 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 Color Metric', | ||
| description: 'Displays a metric with a color according to the planned state of health.', | ||
| icon: 'fa-calculator', | ||
| template: require('plugins/health_metric_vis/health_metric_vis.html'), | ||
| params: { | ||
| defaults: { | ||
| handleNoResults: true, | ||
| fontSize: 60, | ||
| fontColor: 'white', | ||
| invertScale: false, | ||
| redThreshold: 0, | ||
| yellowThreshold: 0, | ||
| redColor: "#fd482f", | ||
| yellowColor: "#ffa500", | ||
| greenColor: "#6dc066" | ||
| }, | ||
| editor: require('plugins/health_metric_vis/health_metric_vis_params.html') | ||
| }, | ||
| editor: healthMetricVisParamsTemplate | ||
| }, | ||
| schemas: new Schemas([ | ||
| { | ||
| group: 'metrics', | ||
| name: 'metric', | ||
| title: 'Metric', | ||
| min: 1, | ||
| max: 1, | ||
| defaults: [ | ||
| { type: 'count', schema: 'metric' } | ||
| ] | ||
| } | ||
| ]) | ||
| }); | ||
| } | ||
| 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() | ||
| export default HealthMetricVisProvider; | ||
| // export the provider so that the visType can be required with Private() | ||
| return 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,75 +1,76 @@ | ||
| import _ from 'lodash'; | ||
| import uiModules from 'ui/modules'; | ||
|
|
||
| const module = uiModules.get('kibana/health_metric_vis', ['kibana']); | ||
| define(function (require) { | ||
| let _ = require('lodash'); | ||
| const module = require('ui/modules').get('health_metric_vis'); | ||
|
|
||
| module.controller('KbnHealthMetricVisController', function ($scope, Private) { | ||
| const tabifyAggResponse = Private(require('ui/agg_response/tabify/tabify')); | ||
| module.controller('KbnHealthMetricVisController', function ($scope, Private) { | ||
| const tabifyAggResponse = Private(require('ui/agg_response/tabify/tabify')); | ||
|
|
||
| const metrics = $scope.metrics = []; | ||
| const metrics = $scope.metrics = []; | ||
|
|
||
| function isInvalid(val) { | ||
| return _.isUndefined(val) || _.isNull(val) || _.isNaN(val); | ||
| } | ||
|
|
||
| function getColor(val, visParams) { | ||
| console.log('function getColor'); | ||
| if (!visParams.invertScale) { | ||
| if (val <= visParams.redThreshold) { | ||
| return visParams.redColor; | ||
| } | ||
| else if (val <= visParams.yellowThreshold && val > visParams.redThreshold ) { | ||
| return visParams.yellowColor; | ||
| } | ||
| else { | ||
| return visParams.greenColor; | ||
| } | ||
| function isInvalid(val) { | ||
| return _.isUndefined(val) || _.isNull(val) || _.isNaN(val); | ||
| } | ||
| else { | ||
| if (val >= visParams.redThreshold) { | ||
| return visParams.redColor; | ||
|
|
||
| function getColor(val, visParams) { | ||
| console.log('function getColor'); | ||
| if (!visParams.invertScale) { | ||
| if (val <= visParams.redThreshold) { | ||
| return visParams.redColor; | ||
| } | ||
| else if (val >= visParams.yellowThreshold && val < visParams.redThreshold) { | ||
| return visParams.yellowColor; | ||
| else if (val <= visParams.yellowThreshold && val > visParams.redThreshold ) { | ||
| return visParams.yellowColor; | ||
| } | ||
| else { | ||
| return visParams.greenColor; | ||
| return visParams.greenColor; | ||
| } | ||
| } | ||
| else { | ||
| if (val >= visParams.redThreshold) { | ||
| return visParams.redColor; | ||
| } | ||
| else if (val >= visParams.yellowThreshold && val < visParams.redThreshold) { | ||
| return visParams.yellowColor; | ||
| } | ||
| else { | ||
| return visParams.greenColor; | ||
| } | ||
| } | ||
| } | ||
| } | ||
| function getFontColor(val,visParams){ | ||
| console.log('function getFontcolor'); | ||
| if(val != null) { | ||
| return visParams.fontColor; | ||
| } | ||
| else{ | ||
| alert("You can't change the color if there is no value.") | ||
| function getFontColor(val,visParams){ | ||
| console.log('function getFontcolor'); | ||
| if(val != null) { | ||
| return visParams.fontColor; | ||
| } | ||
| else{ | ||
| alert("You can't change the color if there is no value.") | ||
| } | ||
| } | ||
| } | ||
|
|
||
| $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); | ||
| let fontColor = getFontColor(value, $scope.vis.params); | ||
|
|
||
| metrics.push({ | ||
| label: column.title, | ||
| formattedValue: formattedValue, | ||
| color: color, | ||
| fontColor: fontColor | ||
| $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); | ||
| let fontColor = getFontColor(value, $scope.vis.params); | ||
|
|
||
| metrics.push({ | ||
| label: column.title, | ||
| formattedValue: formattedValue, | ||
| color: color, | ||
| fontColor: fontColor | ||
| }); | ||
| }); | ||
| }); | ||
| }); | ||
| }; | ||
| }; | ||
|
|
||
| $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)); | ||
| } | ||
| }); | ||
| }); | ||
| }); |