Skip to content

N
nexpie-grafana-theme
Commit b8290305 by Rashid Khan
Options

Merge pull request #38 from rashidkpc/master 

fix wrong height on rows
parents 84689768 eb551491
Showing with 25 additions and 39 deletions
panels/histogram/editor.html
......@@ -33,14 +33,14 @@
</div>
</div>
<h5>Chart Options</h5>
<div class="row-fluid">
<div class="row-fluid" style="margin-bottom:10px;">
<div class="span1"> <label class="small">Bars</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel.bars" ng-checked="panel.bars"></div>
<div class="span1"> <label class="small">Lines</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel.lines" ng-checked="panel.lines"></div>
<div class="span1"> <label class="small">Points</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel.points" ng-checked="panel.points"></div>
<div class="span1"> <label class="small">Stack</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel.stack" ng-checked="panel.stack"></div>
<div class="span1"> <label class="small">Legend</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel.legend" ng-checked="panel.legend"></div>
<div class="span1"> <label class="small">x-Axis</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel['x-axis']" ng-checked="panel['x-axis']"></div>
<div class="span1"> <label class="small">y-Axis</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel['y-axis']" ng-checked="panel['y-axis']"></div>
<div class="span1"> <label class="small">xAxis</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel['x-axis']" ng-checked="panel['x-axis']"></div>
<div class="span1"> <label class="small">yAxis</label><input ng-change="$emit('render')" type="checkbox" ng-model="panel['y-axis']" ng-checked="panel['y-axis']"></div>
<div class="span2" ng-show="panel.lines">
<label class="small">Line Fill</label>
<select ng-change="$emit('render')" class="input-mini" ng-model="panel.fill" ng-options="f for f in [0,1,2,3,4,5,6,7,8,9,10]"></select>
......
panels/histogram/module.html
......@@ -7,7 +7,7 @@
<a class='small' ng-click='zoom(0.5)'><i class='icon-zoom-in'></i> Zoom In</a>
<a class='small' ng-click='zoom(2)'><i class='icon-zoom-out'></i> Zoom Out</a>
</span> |
<span ng-show="panel.legend" ng-repeat='series in legend' style='display:inline-block;padding-right:5px'>
<span ng-show="panel.legend" ng-repeat='series in plot.getData()' style='display:inline-block;padding-right:5px'>
<div style="display:inline-block;background:{{series.color}};height:10px;width:10px;border-radius:5px;"></div>
<div class='small' style='display:inline-block'>{{series.label}} ({{series.hits}})</div>
</span><span class="small"> per <strong>{{panel.interval}}</strong> | (<strong>{{hits}}</strong> total)</span>
......
panels/histogram/module.js
......@@ -23,6 +23,8 @@ angular.module('kibana.histogram', [])
$scope.init = function() {
eventBus.register($scope,'time', function(event,time){$scope.set_time(time)});
// Consider eliminating the check for array, this should always be an array
eventBus.register($scope,'query', function(event, query) {
if(_.isArray(query)) {
$scope.panel.query = _.map(query,function(q) {
......@@ -33,6 +35,7 @@ angular.module('kibana.histogram', [])
}
$scope.get_data();
});
// Now that we're all setup, request the time from our group if we don't
// have it yet
if(_.isUndefined($scope.time))
......@@ -60,9 +63,8 @@ angular.module('kibana.histogram', [])
if(_.isUndefined($scope.panel.index) || _.isUndefined($scope.time))
return
var _segment = _.isUndefined(segment) ? 0 : segment
$scope.panel.loading = true;
var _segment = _.isUndefined(segment) ? 0 : segment
var request = $scope.ejs.Request().indices($scope.panel.index[_segment]);
// Build the question part of the query
......@@ -76,7 +78,7 @@ angular.module('kibana.histogram', [])
)
});
// Build the facet part
// Build the facet part, injecting the query in as a facet filter
_.each(queries, function(v) {
request = request
.facet($scope.ejs.DateHistogramFacet("chart"+_.indexOf(queries,v))
......@@ -86,6 +88,7 @@ angular.module('kibana.histogram', [])
).size(0)
})
// Populate the inspector panel
$scope.populate_modal(request);
// Then run it
......@@ -106,17 +109,11 @@ angular.module('kibana.histogram', [])
return;
}
// Make sure we're still on the same query
if($scope.query_id === query_id) {
var i = 0;
_.each(results.facets, function(v, k) {
// If this isn't a date histogram it must be a QueryFacet, get the
// count and return
if(v._type !== 'date_histogram') {
//$scope.hits += v.count;
return
}
// Null values at each end of the time range ensure we see entire range
if(_.isUndefined($scope.data[i]) || _segment == 0) {
......@@ -131,14 +128,14 @@ angular.module('kibana.histogram', [])
var segment_data = [];
_.each(v.entries, function(v, k) {
segment_data.push([v['time'],v['count']])
hits += v['count'];
$scope.hits += v['count'];
hits += v['count']; // The series level hits counter
$scope.hits += v['count']; // Entire dataset level hits counter
});
data.splice.apply(data,[1,0].concat(segment_data))
data.splice.apply(data,[1,0].concat(segment_data)) // Join histogram data
// Create the flot series
// Create the flot series object
var series = {
data: {
label: $scope.panel.query[i].label || "query"+(parseInt(i)+1),
......@@ -155,7 +152,10 @@ angular.module('kibana.histogram', [])
i++;
});
// Tell the histogram directive to render.
$scope.$emit('render')
// If we still have segments left, get them
if(_segment < $scope.panel.index.length-1) {
$scope.get_data(_segment+1,query_id)
}
......@@ -209,8 +209,6 @@ angular.module('kibana.histogram', [])
// Function for rendering panel
function render_panel() {
// Determine format
// Set barwidth based on specified interval
var barwidth = interval_to_seconds(scope.panel.interval)*1000
......@@ -226,10 +224,8 @@ angular.module('kibana.histogram', [])
// Populate element
try {
var plot = $.plot(elem, scope.data, {
legend: {
show: false,
},
scope.plot = $.plot(elem, scope.data, {
legend: { show: false },
series: {
stack: stack,
lines: {
......@@ -265,11 +261,6 @@ angular.module('kibana.histogram', [])
colors: ['#EB6841','#00A0B0','#6A4A3C','#EDC951','#CC333F']
})
scope.legend = [];
_.each(plot.getData(),function(series) {
scope.legend.push(_.pick(series,'label','color','hits'))
})
// Work around for missing legend at initialization
if(!scope.$$phase)
scope.$apply()
......
panels/hits/module.html
......@@ -2,11 +2,11 @@
<div ng-show="panel.counters">
<p ng-style="panel.style" ng-show="panel.aggregate">{{hits}}</p>
<table ng-style="panel.style" ng-show="!panel.aggregate && panel.arrangement == 'vertical'">
<tr style="line-height:{{panel.style['font-size']}}" ng-repeat="query in data">
<tr style="line-height:{{panel.style['font-size']}}" ng-repeat="query in plot.getData()">
<td ng-show="panel.chart" style="background:{{query.color}};width:{{panel.style['font-size']}}"></td> <td style="padding-right:10px;padding-left:10px;">{{query.label}}</td><td>{{query.hits}}</td>
</tr>
</table>
<div ng-style="panel.style" ng-show="!panel.aggregate && panel.arrangement == 'horizontal'" ng-repeat="query in data" style="float:left;padding-left: 10px;">
<div ng-style="panel.style" ng-show="!panel.aggregate && panel.arrangement == 'horizontal'" ng-repeat="query in plot.getData()" style="float:left;padding-left: 10px;">
<span ng-show='panel.chart'><div style="display:inline-block;border-radius:{{panel.style['font-size']}};background:{{query.color}};height:{{panel.style['font-size']}};width:{{panel.style['font-size']}}"></div></span> {{query.label}} ({{query.hits}}) <span ng-show="!$last">|</span>
</div><br>
</div><div style="clear:both"></div>
......
panels/hits/module.js
......@@ -148,7 +148,8 @@ angular.module('kibana.hits', [])
scripts.wait(function(){
// Populate element
try {
var plot = $.plot(elem, scope.data, {
// Add plot to scope so we can build out own legend
scope.plot = $.plot(elem, scope.data, {
legend: { show: false },
series: {
lines: { show: false, },
......@@ -167,12 +168,6 @@ angular.module('kibana.hits', [])
colors: ['#EB6841','#00A0B0','#6A4A3C','#EDC951','#CC333F']
})
var i = 0;
_.each(plot.getData(),function(series) {
scope.data[i].color = series.color;
i++;
})
// Work around for missing legend at initialization
if(!scope.$$phase)
scope.$apply()
......
partials/dashboard.html
......@@ -2,7 +2,7 @@
<div class="row-fluid container" style="margin-top:10px">
<!-- Rows -->
<div ng-controller="dashcontrol" ng-init="init()"></div>
<div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboards.rows">
<div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboards.rows" style="min-height:{{row.height}};">
<div class="row-control">
<div class="row-fluid row-header" style="padding:0px;margin:0px;height:0px">
<div style="vertical-align:bottom">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment