IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Added goal mode to pie

Browse Source
This commit is contained in:
Rashid Khan 2013-02-18 09:18:36 -07:00
parent 1796323cb9
commit a7ab4b3723
2 changed files with 65 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
panels/pie/editor.html
View File

@ -29,6 +29,23 @@
</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 class="row-fluid">
<div class="span3">
@ -80,6 +97,6 @@
</div>
<div class="span2">
<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>

61
panels/pie/module.js
View File

@ -5,7 +5,7 @@ angular.module('kibana.pie', [])
// Set and populate defaults
var _d = {
query : { field:"_all", query:"*" },
query : { field:"_all", query:"*", goal: 1},
size : 100,
exclude : [],
donut : false,
@ -21,7 +21,7 @@ angular.module('kibana.pie', [])
$scope.init = function() {
eventBus.register($scope,'time', function(event,time){set_time(time)});
eventBus.register($scope,'query', function(event, query) {
if($scope.panel.mode === 'terms') {
if($scope.panel.mode !== 'query') {
$scope.panel.query.query = query;
$scope.get_data();
}
@ -95,7 +95,7 @@ angular.module('kibana.pie', [])
$scope.$emit('render');
});
// If we don't have an array, assume its a term facet.
} else {
} else if ($scope.panel.mode == "terms") {
var results = request
.facet(ejs.TermsFacet('pie')
.field($scope.panel.query.field || $scope.panel.default_field)
@ -129,6 +129,24 @@ angular.module('kibana.pie', [])
});
$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 render_panel() {
var scripts = $LAB.script("common/lib/panels/jquery.flot.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 = {
series: {
pie: {
@ -174,15 +215,7 @@ angular.module('kibana.pie', [])
color: '#999',
label: 'The Rest'
},
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
}
label: label
}
},
//grid: { hoverable: true, clickable: true },
@ -215,7 +248,7 @@ angular.module('kibana.pie', [])
elem.bind("plothover", function (event, pos, item) {
if (item) {
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 {
$("#pie-tooltip").remove();
}