query.options.html 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. <section class="grafana-metric-options">
  2. <div class="tight-form">
  3. <ul class="tight-form-list">
  4. <li class="tight-form-item tight-form-item-icon">
  5. <i class="fa fa-wrench"></i>
  6. </li>
  7. <li class="tight-form-item">
  8. Cache timeout
  9. </li>
  10. <li>
  11. <input type="text"
  12. class="input-mini tight-form-input"
  13. ng-model="panel.cacheTimeout"
  14. bs-tooltip="'Graphite parameter to override memcache default timeout (unit is seconds)'"
  15. data-placement="right"
  16. spellcheck='false'
  17. placeholder="60"></input>
  18. </li>
  19. <li class="tight-form-item">
  20. Max data points
  21. </li>
  22. <li>
  23. <input type="text"
  24. class="input-mini tight-form-input"
  25. ng-model="panel.maxDataPoints"
  26. bs-tooltip="'Override max data points, automatically set to graph width in pixels.'"
  27. data-placement="right"
  28. ng-model-onblur ng-change="get_data()"
  29. spellcheck='false'
  30. placeholder="auto"></input>
  31. </li>
  32. </ul>
  33. <div class="clearfix"></div>
  34. </div>
  35. <div class="tight-form">
  36. <ul class="tight-form-list">
  37. <li class="tight-form-item tight-form-item-icon">
  38. <i class="fa fa-info-circle"></i>
  39. </li>
  40. <li class="tight-form-item">
  41. <a ng-click="toggleEditorHelp(1);" bs-tooltip="'click to show helpful info'" data-placement="bottom">
  42. shorter legend names
  43. </a>
  44. </li>
  45. <li class="tight-form-item">
  46. <a ng-click="toggleEditorHelp(2);" bs-tooltip="'click to show helpful info'" data-placement="bottom">
  47. series as parameters
  48. </a>
  49. </li>
  50. <li class="tight-form-item">
  51. <a ng-click="toggleEditorHelp(3)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
  52. stacking
  53. </a>
  54. </li>
  55. <li class="tight-form-item">
  56. <a ng-click="toggleEditorHelp(4)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
  57. templating
  58. </a>
  59. </li>
  60. <li class="tight-form-item">
  61. <a ng-click="toggleEditorHelp(5)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
  62. max data points
  63. </a>
  64. </li>
  65. </ul>
  66. <div class="clearfix"></div>
  67. </div>
  68. </section>
  69. <div class="editor-row">
  70. <div class="pull-left" style="margin-top: 30px;">
  71. <div class="grafana-info-box span8" ng-if="editorHelpIndex === 1">
  72. <h5>Shorter legend names</h5>
  73. <ul>
  74. <li>alias() function to specify a custom series name</li>
  75. <li>aliasByNode(2) to alias by a specific part of your metric path</li>
  76. <li>aliasByNode(2, -1) you can add multiple segment paths, and use negative index</li>
  77. <li>groupByNode(2, 'sum') is useful if you have 2 wildcards in your metric path and want to sumSeries and group by</li>
  78. </ul>
  79. </div>
  80. <div class="grafana-info-box span8" ng-if="editorHelpIndex === 2">
  81. <h5>Series as parameter</h5>
  82. <ul>
  83. <li>Some graphite functions allow you to have many series arguments</li>
  84. <li>Use #[A-Z] to use a graphite query as parameter to a function</li>
  85. <li>
  86. Examples:
  87. <ul>
  88. <li>asPercent(#A, #B)</li>
  89. <li>prod.srv-01.counters.count - asPercent(#A) : percentage of count in comparison with A query</li>
  90. <li>prod.srv-01.counters.count - sumSeries(#A) : sum count and series A </li>
  91. <li>divideSeries(#A, #B)</li>
  92. </ul>
  93. </li>
  94. <li>If a query is added only to be used as a parameter, hide it from the graph with the eye icon</li>
  95. </ul>
  96. </div>
  97. <div class="grafana-info-box span6" ng-if="editorHelpIndex === 3">
  98. <h5>Stacking</h5>
  99. <ul>
  100. <li>You find the stacking option under Display Styles tab</li>
  101. <li>When stacking is enabled make sure null point mode is set to 'null as zero'</li>
  102. </ul>
  103. </div>
  104. <div class="grafana-info-box span6" ng-if="editorHelpIndex === 4">
  105. <h5>Templating</h5>
  106. <ul>
  107. <li>You can use a template variable in place of metric names</li>
  108. <li>You can use a template variable in place of function parameters</li>
  109. <li>You enable the templating feature in Dashboard settings / Feature toggles </li>
  110. </ul>
  111. </div>
  112. <div class="grafana-info-box span6" ng-if="editorHelpIndex === 5">
  113. <h5>Max data points</h5>
  114. <ul>
  115. <li>Every graphite request is issued with a maxDataPoints parameter</li>
  116. <li>Graphite uses this parameter to consolidate the real number of values down to this number</li>
  117. <li>If there are more real values, then by default they will be consolidated using averages</li>
  118. <li>This could hide real peaks and max values in your series</li>
  119. <li>You can change how point consolidation is made using the consolidateBy graphite function</li>
  120. <li>Point consolidation will effect series legend values (min,max,total,current)</li>
  121. <li>If you override maxDataPoint and set a high value performance can be severely effected</li>
  122. </ul>
  123. </div>
  124. </div>
  125. </div>