module.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. labjs = labjs.script("common/lib/panels/jquery.flot.js")
  2. .script("common/lib/panels/jquery.flot.pie.js")
  3. angular.module('kibana.piequery', [])
  4. .directive('piequery', function() {
  5. return {
  6. restrict: 'A',
  7. link: function(scope, elem, attrs) {
  8. // Specify defaults for ALL directives
  9. var _d = {
  10. queries : ["*"],
  11. donut : false,
  12. tilt : false,
  13. legend : true,
  14. }
  15. // Set ready flag and fill parameters (REQUIRED IN EVERY PANEL)
  16. scope.$watch(function () {
  17. return (attrs.params && scope.index) ? true : false;
  18. }, function (ready) {
  19. scope.ready = ready;
  20. if(ready) {
  21. scope.params = JSON.parse(attrs.params);
  22. _.each(_d, function(v, k) {
  23. scope.params[k] = _.isUndefined(scope.params[k])
  24. ? _d[k] : scope.params[k];
  25. });
  26. }
  27. });
  28. // Also get the data if time frame changes.
  29. // (REQUIRED IN EVERY PANEL)
  30. scope.$watch(function() {
  31. return angular.toJson([scope.from, scope.to, scope.ready])
  32. }, function(){
  33. if(scope.ready)
  34. get_data(scope,elem,attrs);
  35. });
  36. // Re-rending the panel if it is resized,
  37. scope.$watch('data', function() {
  38. if(scope.ready)
  39. render_panel(scope,elem,attrs);
  40. });
  41. // Or if the model changes
  42. angular.element(window).bind('resize', function(){
  43. render_panel(scope,elem,attrs);
  44. });
  45. // Function for getting data
  46. function get_data(scope,elem,attrs) {
  47. var params = scope.params;
  48. var ejs = scope.ejs;
  49. var request = ejs.Request().indices(scope.index);
  50. var queries = [];
  51. // Build the question part of the query
  52. _.each(params.queries, function(v) {
  53. queries.push(ejs.FilteredQuery(
  54. ejs.QueryStringQuery(v || '*'),
  55. ejs.RangeFilter(config.timefield)
  56. .from(scope.from)
  57. .to(scope.to)
  58. .cache(false))
  59. )
  60. });
  61. _.each(queries, function(v) {
  62. request = request.facet(ejs.QueryFacet(_.indexOf(queries,v))
  63. .query(v)
  64. .facetFilter(ejs.QueryFilter(v))
  65. )
  66. })
  67. // Then the insert into facet and make the request
  68. var results = request.doSearch();
  69. // Populate scope when we have results
  70. results.then(function(results) {
  71. scope.hits = results.hits.total;
  72. scope.data = results.facets;
  73. });
  74. }
  75. // Function for rendering panel
  76. function render_panel(scope,elem,attrs) {
  77. // Parse our params object
  78. var params = scope.params;
  79. // Create graph array
  80. scope.graph = [];
  81. _.each(scope.data, function(v, k) {
  82. var point = {
  83. label : params.queries[k],
  84. data : v['count']
  85. }
  86. if(!_.isUndefined(params.colors))
  87. point.color = params.colors[k%params.colors.length];
  88. scope.graph.push(point)
  89. });
  90. // Populate element
  91. $.plot(elem, scope.graph, {
  92. series: {
  93. pie: {
  94. innerRadius: params.donut ? 0.4 : 0,
  95. tilt: params.tilt ? 0.45 : 1,
  96. radius: 1,
  97. show: true,
  98. combine: {
  99. color: '#999',
  100. label: 'The Rest'
  101. },
  102. label: {
  103. show: true,
  104. radius: 2/3,
  105. formatter: function(label, series){
  106. return '<div style="font-size:8pt;text-align:center;padding:2px;color:white;">'+
  107. label+'<br/>'+Math.round(series.percent)+'%</div>';
  108. },
  109. threshold: 0.1
  110. }
  111. }
  112. },
  113. //grid: { hoverable: true, clickable: true },
  114. legend: { show: params.legend }
  115. });
  116. //elem.show();
  117. }
  118. }
  119. };
  120. })