diff --git a/panels/hits/editor.html b/panels/hits/editor.html index c51df1a2c1a..b1549c4b9ba 100644 --- a/panels/hits/editor.html +++ b/panels/hits/editor.html @@ -6,13 +6,34 @@
-
+
+
-
- + +
+
Chart Options
+
+
+ + +
+
+
+ + +
+
+ +
+
+ +
+
+
+
Queries
diff --git a/panels/hits/module.html b/panels/hits/module.html index 0a8f9638c7d..33bdc083c58 100644 --- a/panels/hits/module.html +++ b/panels/hits/module.html @@ -1,14 +1,42 @@ -
+ +
+

{{hits}}

+ + - +
{{query.label}}{{query.hits}} {{query.label}}{{query.data[0][1]}}
+ +
-
{{query.label}} ({{query.hits}}) | +
{{query.label}} ({{query.data[0][1]}})

-
-
+ +
+
+
+ +
+ +

{{hits}}

+ + + + + + +
{{query.label}}{{query.data[0][1]}}
+ + +
+
{{query.label}} ({{query.data[0][1]}}) +

+ +
+ + \ No newline at end of file diff --git a/panels/hits/module.js b/panels/hits/module.js index f435908f251..64b2d5dc7c2 100644 --- a/panels/hits/module.js +++ b/panels/hits/module.js @@ -8,9 +8,11 @@ angular.module('kibana.hits', []) style : { "font-size": '10pt'}, aggregate : true, arrangement : 'vertical', - chart : true, - counters: true, - count_pos: 'above' + chart : 'none', + counter_pos : 'above', + donut : false, + tilt : false, + labels : true } _.defaults($scope.panel,_d) @@ -143,31 +145,61 @@ angular.module('kibana.hits', []) function render_panel() { var scripts = $LAB.script("common/lib/panels/jquery.flot.js") - - // Populate element. Note that jvectormap appends, does not replace. + .script("common/lib/panels/jquery.flot.pie.js") + + // Populate element. scripts.wait(function(){ // Populate element try { // Add plot to scope so we can build out own legend - scope.plot = $.plot(elem, scope.data, { - legend: { show: false }, - series: { - lines: { show: false, }, - bars: { show: true, fill: 1, barWidth: 0.8, horizontal: false }, - shadowSize: 1 - }, - yaxis: { show: true, min: 0, color: "#000" }, - xaxis: { show: false }, - grid: { - backgroundColor: '#fff', - borderWidth: 0, - borderColor: '#eee', - color: "#eee", - hoverable: true, - }, - colors: ['#86B22D','#BF6730','#1D7373','#BFB930','#BF3030','#77207D'] - }) - + if(scope.panel.chart === 'bar') + scope.plot = $.plot(elem, scope.data, { + legend: { show: false }, + series: { + lines: { show: false, }, + bars: { show: true, fill: 1, barWidth: 0.8, horizontal: false }, + shadowSize: 1 + }, + yaxis: { show: true, min: 0, color: "#000" }, + xaxis: { show: false }, + grid: { + backgroundColor: '#fff', + borderWidth: 0, + borderColor: '#eee', + color: "#eee", + hoverable: true, + }, + colors: ['#86B22D','#BF6730','#1D7373','#BFB930','#BF3030','#77207D'] + }) + if(scope.panel.chart === 'pie') + scope.plot = $.plot(elem, scope.data, { + legend: { show: false }, + series: { + pie: { + innerRadius: scope.panel.donut ? 0.4 : 0, + tilt: scope.panel.tilt ? 0.45 : 1, + radius: 1, + show: true, + combine: { + color: '#999', + label: 'The Rest' + }, + label: { + show: scope.panel.labels, + radius: 2/3, + formatter: function(label, series){ + return '
'+ + label+'
'+Math.round(series.percent)+'%
'; + }, + threshold: 0.1 + } + } + }, + //grid: { hoverable: true, clickable: true }, + grid: { hoverable: true, clickable: true }, + colors: ['#86B22D','#BF6730','#1D7373','#BFB930','#BF3030','#77207D'] + }); + // Work around for missing legend at initialization if(!scope.$$phase) scope.$apply() @@ -198,9 +230,11 @@ angular.module('kibana.hits', []) elem.bind("plothover", function (event, pos, item) { if (item) { + var value = scope.panel.chart === 'bar' ? + item.datapoint[1] : item.datapoint[1][0][1]; tt(pos.pageX, pos.pageY, - "
"+ - item.datapoint[1].toFixed(0)) + "
"+value.toFixed(0)) } else { $("#pie-tooltip").remove(); } diff --git a/panels/map/module.js b/panels/map/module.js index 0383b18052e..17afbc2d3fc 100644 --- a/panels/map/module.js +++ b/panels/map/module.js @@ -82,7 +82,7 @@ angular.module('kibana.map', []) $scope.build_search = function(field,value) { $scope.panel.query = add_to_query($scope.panel.query,field,value,false) $scope.get_data(); - eventBus.broadcast($scope.$id,$scope.panel.group,'query',$scope.panel.query); + eventBus.broadcast($scope.$id,$scope.panel.group,'query',[$scope.panel.query]); } }) diff --git a/panels/pie/editor.html b/panels/pie/editor.html index 395a8423963..a3059a243a2 100644 --- a/panels/pie/editor.html +++ b/panels/pie/editor.html @@ -46,41 +46,6 @@
-
-
-
- -
Label
- - -
-
-
-
Query
- - -
-
-
-
-
-
-
-
- -
-
-
-
- - -
-
-
- -
-
-
@@ -97,7 +62,7 @@
- +
Panel Spy
diff --git a/panels/pie/module.html b/panels/pie/module.html index 1346b88f765..3a78b2b9dfd 100644 --- a/panels/pie/module.html +++ b/panels/pie/module.html @@ -2,11 +2,11 @@ - -
-
-
{{series.label}} ({{series.percent}}%)
-
- + +
+
{{query.label}} ({{query.data[0][1]}}) +

+
+
\ No newline at end of file diff --git a/panels/pie/module.js b/panels/pie/module.js index fb8cdd77963..709363ca192 100644 --- a/panels/pie/module.js +++ b/panels/pie/module.js @@ -20,16 +20,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 !== 'query') { - $scope.panel.query.query = query; - $scope.panel.query.query = _.isArray(query) ? query[0] : query; - } else { - if(_.isArray(query)) - $scope.panel.query = _.map(query,function(q) { - return {query: q, label: q}}) - else - $scope.panel.query[0] = {query: query, label: query} - } + $scope.panel.query.query = _.isArray(query) ? query[0] : query; $scope.get_data(); }); // Now that we're all setup, request the time from our group @@ -60,9 +51,6 @@ angular.module('kibana.pie', []) case 'terms': $scope.panel.query = {query:"*",field:"_all"}; break; - case 'query': - $scope.panel.query = [{query:"*",label:"*"}]; - break; case 'goal': $scope.panel.query = {query:"*",goal:100}; break; @@ -77,49 +65,8 @@ angular.module('kibana.pie', []) $scope.panel.loading = true; var request = $scope.ejs.Request().indices($scope.panel.index); - // If we have an array, use query facet - if($scope.panel.mode == "query") { - if(!(_.isArray($scope.panel.query))) - $scope.panel.query = [$scope.panel.query]; - var queries = []; - // Build the question part of the query - _.each($scope.panel.query, function(v) { - queries.push(ejs.FilteredQuery( - ejs.QueryStringQuery(v.query || '*'), - ejs.RangeFilter($scope.time.field) - .from($scope.time.from) - .to($scope.time.to)) - ) - }); - - // Then the insert into facet and make the request - _.each(queries, function(v) { - request = request.facet(ejs.QueryFacet(_.indexOf(queries,v)) - .query(v) - .facetFilter(ejs.QueryFilter(v)) - ) - }) - $scope.populate_modal(request); - var results = request.doSearch(); - - // Populate scope when we have results - results.then(function(results) { - $scope.panel.loading = false; - $scope.hits = results.hits.total; - $scope.data = []; - _.each(results.facets, function(v, k) { - var series = {}; - var label = _.isUndefined($scope.panel.query[k].label) ? - $scope.panel.query[k].query : $scope.panel.query[k].label - var slice = { label : label, data : v.count }; - if (!(_.isUndefined($scope.panel.query[k].color))) - slice.color = $scope.panel.query[k].color; - $scope.data.push(slice) - }); - $scope.$emit('render'); - }); - // If we don't have an array, assume its a term facet. - } else if ($scope.panel.mode == "terms") { + // Terms mode + if ($scope.panel.mode == "terms") { request = request .facet(ejs.TermsFacet('pie') .field($scope.panel.query.field || $scope.panel.default_field) @@ -131,7 +78,6 @@ angular.module('kibana.pie', []) ejs.RangeFilter($scope.time.field) .from($scope.time.from) .to($scope.time.to) - .cache(false) )))).size(0) $scope.populate_modal(request); @@ -157,6 +103,7 @@ angular.module('kibana.pie', []) }); $scope.$emit('render'); }); + // Goal mode } else { request = request .query(ejs.QueryStringQuery($scope.panel.query.query || '*')) @@ -196,7 +143,7 @@ angular.module('kibana.pie', []) $scope.build_search = function(field,value) { $scope.panel.query.query = add_to_query($scope.panel.query.query,field,value,false) $scope.get_data(); - eventBus.broadcast($scope.$id,$scope.panel.group,'query',$scope.panel.query.query); + eventBus.broadcast($scope.$id,$scope.panel.group,'query',[$scope.panel.query.query]); } function set_time(time) { @@ -275,14 +222,7 @@ angular.module('kibana.pie', []) // Populate element if(elem.is(":visible")){ scripts.wait(function(){ - var plot = $.plot(elem, scope.data, pie); - scope.legend = []; - _.each(plot.getData(),function(series) { - var item = _.pick(series,'label','color','percent') - item.percent = parseFloat(item.percent).toFixed(1) - scope.legend.push(item) - }) - console.log(scope.legend) + scope.plot = $.plot(elem, scope.data, pie); }); } } diff --git a/panels/stringquery/module.js b/panels/stringquery/module.js index 95b0d3deed4..dac83338e84 100644 --- a/panels/stringquery/module.js +++ b/panels/stringquery/module.js @@ -13,24 +13,18 @@ angular.module('kibana.stringquery', []) } _.defaults($scope.panel,_d); - var _groups = _.isArray($scope.panel.group) ? - $scope.panel.group : [$scope.panel.group]; - $scope.init = function() { - // I don't like this compromise. I'm not totally sure what this panel - // Should do if its in multi query mode and receives a query. For now, just - // replace the first one, though I feel like that isn't right. + // If we're in multi query mode, they all get wiped out if we receive a + // query. Query events must be exchanged as arrays. eventBus.register($scope,'query',function(event,query) { - if (_.isArray($scope.panel.query)) - $scope.panel.query[0] = query - else $scope.panel.query = query; }); } $scope.send_query = function(query) { - eventBus.broadcast($scope.$id,$scope.panel.group,'query',query) + var _query = _.isArray(query) ? query : [query] + eventBus.broadcast($scope.$id,$scope.panel.group,'query',_query) } $scope.add_query = function() {