statsEditor.html 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <div class="editor-row">
  2. <div class="section">
  3. <h5>Big values</h5>
  4. <div class="editor-option">
  5. <label class="small">Template</label>
  6. <input type="text" class="input-xlarge" ng-model="panel.template" ng-blur="render()"></input>
  7. </div>
  8. </div>
  9. <div class="section">
  10. <h5>Formats</h5>
  11. <div class="editor-option">
  12. <label class="small">Unit format</label>
  13. <select class="input-small" ng-model="panel.format" ng-options="f for f in ['none','short','bytes', 'bits', 'bps', 's', 'ms', 'µs', 'ns', 'percent']" ng-change="render()"></select>
  14. </div>
  15. </div>
  16. <div class="section">
  17. <h5>Coloring</h5>
  18. <editor-opt-bool text="Background" model="panel.colorBackground" change="setColoring({background: true})"></editor-opt-bool>
  19. <editor-opt-bool text="Value" model="panel.colorValue" change="setColoring({value: true})"></editor-opt-bool>
  20. <div class="editor-option">
  21. <label class="small">Thresholds</label>
  22. <input type="text" class="input-large" ng-model="panel.thresholds" ng-blur="render()"></input>
  23. </div>
  24. <div class="editor-option">
  25. <label class="small">Color</label>
  26. <spectrum-picker ng-model="panel.colors[0]" ng-change="render()" ></spectrum-picker>
  27. <spectrum-picker ng-model="panel.colors[1]" ng-change="render()" ></spectrum-picker>
  28. <spectrum-picker ng-model="panel.colors[2]" ng-change="render()" ></spectrum-picker>
  29. <a class="pointer" ng-click="invertColorOrder()">invert order</a>
  30. </div>
  31. </div>
  32. </div>
  33. <div class="editor-row">
  34. <div class="section">
  35. <h5>Spark lines</h5>
  36. </div>
  37. <editor-opt-bool text="Spark line" model="panel.sparkline.show" change="render()"></editor-opt-bool>
  38. <editor-opt-bool text="Background mode" model="panel.sparkline.full" change="render()"></editor-opt-bool>
  39. <div class="editor-option">
  40. <label class="small">Line color</label>
  41. <spectrum-picker ng-model="panel.sparkline.lineColor" ng-change="render()" ></spectrum-picker>
  42. <spectrum-picker ng-model="panel.sparkline.fillColor" ng-change="render()" ></spectrum-picker>
  43. </div>
  44. </div>
  45. <div class="editor-row">
  46. <div class="section">
  47. <h5>Series options</h5>
  48. <div class="grafana-target" ng-repeat="series in data.series">
  49. <div class="grafana-target-inner">
  50. <ul class="grafana-segment-list">
  51. <li class="grafana-target-segment">
  52. <i class="icon-eye-open" ng-click="hideSeries(series)"></i>
  53. </li>
  54. <li class="grafana-target-segment">
  55. {{series.info.alias}}
  56. </li>
  57. <li class="grafana-target-segment">
  58. </li>
  59. </ul>
  60. <div class="clearfix"></div>
  61. </div>
  62. </div>
  63. </div>
  64. </div>