mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Added goal mode to pie
This commit is contained in:
parent
1796323cb9
commit
a7ab4b3723
@ -29,6 +29,23 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div ng-switch-when="goal">
|
||||||
|
<div class="row-fluid">
|
||||||
|
<div class="span2">
|
||||||
|
<form style="margin-bottom: 0px">
|
||||||
|
<h6>Goal</h6>
|
||||||
|
<input type="number" style="width:90%" ng-model="panel.query.goal">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<form class="input-append" style="margin-bottom: 0px">
|
||||||
|
<h6>Query</h6>
|
||||||
|
<input type="text" style="width:80%" ng-model="panel.query.query">
|
||||||
|
<button class="btn" ng-click="get_data()"><i class="icon-search"></i></button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div ng-switch-when="query">
|
<div ng-switch-when="query">
|
||||||
<div class="row-fluid">
|
<div class="row-fluid">
|
||||||
<div class="span3">
|
<div class="span3">
|
||||||
@ -80,6 +97,6 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="span2">
|
<div class="span2">
|
||||||
<label class="small">Mode</label>
|
<label class="small">Mode</label>
|
||||||
<select class="input-small" ng-model="panel.mode" ng-options="f for f in ['query','terms']"></select>
|
<select class="input-small" ng-model="panel.mode" ng-options="f for f in ['query','terms','goal']"></select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
@ -5,7 +5,7 @@ angular.module('kibana.pie', [])
|
|||||||
|
|
||||||
// Set and populate defaults
|
// Set and populate defaults
|
||||||
var _d = {
|
var _d = {
|
||||||
query : { field:"_all", query:"*" },
|
query : { field:"_all", query:"*", goal: 1},
|
||||||
size : 100,
|
size : 100,
|
||||||
exclude : [],
|
exclude : [],
|
||||||
donut : false,
|
donut : false,
|
||||||
@ -21,7 +21,7 @@ angular.module('kibana.pie', [])
|
|||||||
$scope.init = function() {
|
$scope.init = function() {
|
||||||
eventBus.register($scope,'time', function(event,time){set_time(time)});
|
eventBus.register($scope,'time', function(event,time){set_time(time)});
|
||||||
eventBus.register($scope,'query', function(event, query) {
|
eventBus.register($scope,'query', function(event, query) {
|
||||||
if($scope.panel.mode === 'terms') {
|
if($scope.panel.mode !== 'query') {
|
||||||
$scope.panel.query.query = query;
|
$scope.panel.query.query = query;
|
||||||
$scope.get_data();
|
$scope.get_data();
|
||||||
}
|
}
|
||||||
@ -95,7 +95,7 @@ angular.module('kibana.pie', [])
|
|||||||
$scope.$emit('render');
|
$scope.$emit('render');
|
||||||
});
|
});
|
||||||
// If we don't have an array, assume its a term facet.
|
// If we don't have an array, assume its a term facet.
|
||||||
} else {
|
} else if ($scope.panel.mode == "terms") {
|
||||||
var results = request
|
var results = request
|
||||||
.facet(ejs.TermsFacet('pie')
|
.facet(ejs.TermsFacet('pie')
|
||||||
.field($scope.panel.query.field || $scope.panel.default_field)
|
.field($scope.panel.query.field || $scope.panel.default_field)
|
||||||
@ -129,6 +129,24 @@ angular.module('kibana.pie', [])
|
|||||||
});
|
});
|
||||||
$scope.$emit('render');
|
$scope.$emit('render');
|
||||||
});
|
});
|
||||||
|
} else {
|
||||||
|
console.log('goal')
|
||||||
|
var results = request
|
||||||
|
.query(ejs.QueryStringQuery($scope.panel.query.query || '*'))
|
||||||
|
.filter(ejs.RangeFilter(config.timefield)
|
||||||
|
.from($scope.time.from)
|
||||||
|
.to($scope.time.to)
|
||||||
|
.cache(false))
|
||||||
|
.size(0)
|
||||||
|
.doSearch();
|
||||||
|
results.then(function(results) {
|
||||||
|
var complete = results.hits.total;
|
||||||
|
var remaining = $scope.panel.query.goal - complete;
|
||||||
|
$scope.data = [
|
||||||
|
{ label : 'Complete', data : complete, color: '#51A351' },
|
||||||
|
{ data : remaining, color: '#EEE'}]
|
||||||
|
$scope.$emit('render');
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -159,10 +177,33 @@ angular.module('kibana.pie', [])
|
|||||||
|
|
||||||
// Function for rendering panel
|
// Function for rendering panel
|
||||||
function render_panel() {
|
function render_panel() {
|
||||||
|
|
||||||
var scripts = $LAB.script("common/lib/panels/jquery.flot.js")
|
var scripts = $LAB.script("common/lib/panels/jquery.flot.js")
|
||||||
.script("common/lib/panels/jquery.flot.pie.js")
|
.script("common/lib/panels/jquery.flot.pie.js")
|
||||||
|
|
||||||
|
if(scope.panel.mode === 'goal')
|
||||||
|
var label = {
|
||||||
|
show: scope.panel.labels,
|
||||||
|
radius: 0,
|
||||||
|
formatter: function(label, series){
|
||||||
|
var font = parseInt(scope.row.height.replace('px',''))/10 + String('px')
|
||||||
|
if(!(_.isUndefined(label)))
|
||||||
|
return '<div style="font-size:'+font+';font-weight:bold;text-align:center;padding:2px;color:black;">'+
|
||||||
|
Math.round(series.percent)+'%</div>';
|
||||||
|
else
|
||||||
|
return ''
|
||||||
|
},
|
||||||
|
}
|
||||||
|
else
|
||||||
|
var label = {
|
||||||
|
show: scope.panel.labels,
|
||||||
|
radius: 2/3,
|
||||||
|
formatter: function(label, series){
|
||||||
|
return '<div style="font-size:8pt;text-align:center;padding:2px;color:white;">'+
|
||||||
|
label+'<br/>'+Math.round(series.percent)+'%</div>';
|
||||||
|
},
|
||||||
|
threshold: 0.1
|
||||||
|
}
|
||||||
|
|
||||||
var pie = {
|
var pie = {
|
||||||
series: {
|
series: {
|
||||||
pie: {
|
pie: {
|
||||||
@ -174,15 +215,7 @@ angular.module('kibana.pie', [])
|
|||||||
color: '#999',
|
color: '#999',
|
||||||
label: 'The Rest'
|
label: 'The Rest'
|
||||||
},
|
},
|
||||||
label: {
|
label: label
|
||||||
show: scope.panel.labels,
|
|
||||||
radius: 2/3,
|
|
||||||
formatter: function(label, series){
|
|
||||||
return '<div style="font-size:8pt;text-align:center;padding:2px;color:white;">'+
|
|
||||||
label+'<br/>'+Math.round(series.percent)+'%</div>';
|
|
||||||
},
|
|
||||||
threshold: 0.1
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
//grid: { hoverable: true, clickable: true },
|
//grid: { hoverable: true, clickable: true },
|
||||||
@ -215,7 +248,7 @@ angular.module('kibana.pie', [])
|
|||||||
elem.bind("plothover", function (event, pos, item) {
|
elem.bind("plothover", function (event, pos, item) {
|
||||||
if (item) {
|
if (item) {
|
||||||
var percent = parseFloat(item.series.percent).toFixed(1) + "%";
|
var percent = parseFloat(item.series.percent).toFixed(1) + "%";
|
||||||
piett(pos.pageX, pos.pageY, percent + " " + item.series.label);
|
piett(pos.pageX, pos.pageY, percent + " " + (item.series.label||""));
|
||||||
} else {
|
} else {
|
||||||
$("#pie-tooltip").remove();
|
$("#pie-tooltip").remove();
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user