namenode_heap.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. /**
  2. * Licensed to the Apache Software Foundation (ASF) under one
  3. * or more contributor license agreements. See the NOTICE file
  4. * distributed with this work for additional information
  5. * regarding copyright ownership. The ASF licenses this file
  6. * to you under the Apache License, Version 2.0 (the
  7. * "License"); you may not use this file except in compliance
  8. * with the License. You may obtain a copy of the License at
  9. *
  10. * http://www.apache.org/licenses/LICENSE-2.0
  11. *
  12. * Unless required by applicable law or agreed to in writing, software
  13. * distributed under the License is distributed on an "AS IS" BASIS,
  14. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15. * See the License for the specific language governing permissions and
  16. * limitations under the License.
  17. */
  18. var App = require('app');
  19. var numberUtils = require('utils/number_utils');
  20. App.NameNodeHeapPieChartView = App.DashboardWidgetView.extend({
  21. templateName: require('templates/main/dashboard/widgets/pie_chart'),
  22. title: Em.I18n.t('dashboard.widgets.NameNodeHeap'),
  23. id: '1',
  24. isPieChart: true,
  25. isText: false,
  26. isProgressBar: false,
  27. model_type: 'hdfs',
  28. hiddenInfo: function () {
  29. var memUsed = this.get('model').get('jvmMemoryHeapUsed');
  30. var memCommitted = this.get('model').get('jvmMemoryHeapCommitted');
  31. var percent = memCommitted > 0 ? ((100 * memUsed) / memCommitted) : 0;
  32. var result = [];
  33. result.pushObject(percent.toFixed(1) + '% used');
  34. result.pushObject(numberUtils.bytesToSize(memUsed, 1, 'parseFloat', 1000000) + ' of ' + numberUtils.bytesToSize(memCommitted, 1, 'parseFloat', 1000000));
  35. return result;
  36. }.property('model.jvmMemoryHeapUsed', 'model.jvmMemoryHeapCommitted'),
  37. thresh1: null,
  38. thresh2: null,
  39. maxValue: 100,
  40. isPieExist: function () {
  41. var total = this.get('model.jvmMemoryHeapCommitted') * 1000000;
  42. return total > 0 ;
  43. }.property('model.jvmMemoryHeapCommitted'),
  44. content: App.ChartPieView.extend({
  45. model: null, //data bind here
  46. id: 'widget-nn-heap', // html id
  47. stroke: '#D6DDDF', //light grey
  48. thresh1: null, //bind from parent
  49. thresh2: null,
  50. innerR: 25,
  51. existCenterText: true,
  52. centerTextColor: function () {
  53. return this.get('contentColor');
  54. }.property('contentColor'),
  55. palette: new Rickshaw.Color.Palette({
  56. scheme: [ '#FFFFFF', '#D6DDDF'].reverse()
  57. }),
  58. data: function () {
  59. var used = this.get('model.jvmMemoryHeapUsed') * 1000000;
  60. var total = this.get('model.jvmMemoryHeapCommitted') * 1000000;
  61. var percent = total > 0 ? ((used)*100 / total).toFixed() : 0;
  62. return [ percent, 100 - percent];
  63. }.property('model.jvmMemoryHeapUsed', 'model.jvmMemoryHeapCommitted'),
  64. contentColor: function () {
  65. var used = parseFloat(this.get('data')[0]);
  66. var thresh1 = parseFloat(this.get('thresh1'));
  67. var thresh2 = parseFloat(this.get('thresh2'));
  68. var color_green = '#95A800';
  69. var color_red = '#B80000';
  70. var color_orange = '#FF8E00';
  71. if (used <= thresh1) {
  72. this.set('palette', new Rickshaw.Color.Palette({
  73. scheme: [ '#FFFFFF', color_green ].reverse()
  74. }))
  75. return color_green;
  76. } else if (used <= thresh2) {
  77. this.set('palette', new Rickshaw.Color.Palette({
  78. scheme: [ '#FFFFFF', color_orange ].reverse()
  79. }))
  80. return color_orange;
  81. } else {
  82. this.set('palette', new Rickshaw.Color.Palette({
  83. scheme: [ '#FFFFFF', color_red ].reverse()
  84. }))
  85. return color_red;
  86. }
  87. }.property('data', 'this.thresh1', 'this.thresh2'),
  88. // refresh text and color when data in model changed
  89. refreshSvg: function () {
  90. // remove old svg
  91. var old_svg = $("#" + this.id);
  92. if(old_svg){
  93. old_svg.remove();
  94. }
  95. // draw new svg
  96. this.appendSvg();
  97. }.observes('this.data', 'this.thresh1', 'this.thresh2')
  98. })
  99. })