TizenScripts/tizen-memorytest/memory.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <title>WebKit memory statistics</title>
   5 <script src="jquery.js"></script>
   6 <script src="jquery.flot.js"></script>
   7 <script src="jquery.flot.stack.js"></script>
   8 <script src="memory.js"></script>
   9 </head>
  10 <body>
  11 <div id="bar" style="width: 750px; height: 300px; float: left;"></div>
  12 <div id="legend" style="width: 150px; height: 300px; float: left;"></div>
  13 <div id="dummy" style="clear: both;"></div>
  14 <div id="line" style="width: 900px; height: 300px; margin-top: 30px; margin-left: 30px;"></div>
  15 <script>
  16 function line_graph(element, labels, kvslist, key, index) {
  17     var nlabels = labels.length;
  18     var values = [];
  19     var ticks = [];
  20     for (var i = 0; i < kvslist.length; i++) {
  21         var tick = kvslist[i][0];
  22         var kvs = kvslist[i][1];
  23         for (var j = 0; j < kvs.length; j++) {
  24             if (kvs[j][0] == key) break;
  25         }
  26         var kv = kvs[j];
  27         if (index == -1) {
  28             var sum = 0;
  29             for (var j = 0; j < nlabels; j++) {
  30                 sum += kv[j + 1];
  31             }
  32             values.push([i, sum]);
  33         } else {
  34             values.push([i, kv[index + 1]]);
  35         }
  36         ticks.push([i, tick]);
  37     }
  38     $.plot(element, [{data: values}], {
  39         grid: {hoverable: true, clickable: true},
  40         xaxis: {ticks: ticks}
  41     });
  42     element.bind("plotclick", function (event, pos, item) {
  43         var i = item.datapoint[0];
  44         horizontal_bar_graph($("#bar"), labels, kvslist, i);
  45     });
  46 }
  47 function horizontal_bar_graph(element, labels, kvslist, i) {
  48     var nlabels = labels.length;
  49     var kvs = kvslist[i][1];
  50     var data = [];
  51     var ticks = [];
  52     for (var i = 0; i < nlabels; i++) {
  53         var label = labels[i];
  54         data.push({label: label, data: []});
  55     }
  56     for (var i = 0; i < kvs.length; i++) {
  57         var kv = kvs[kvs.length - i - 1];
  58         for (var j = 0; j < nlabels; j++) {
  59             data[j].data.push([kv[j + 1], i]);
  60         }
  61         ticks.push([i, kv[0]]);
  62     }
  63     $.plot(element, data, {
  64         series: {stack: true, bars: {show: true, align: "center", horizontal: true}},
  65         grid: {hoverable: true, clickable: true},
  66         yaxis: {ticks: ticks},
  67         legend: {container: $("#legend")}
  68     });
  69     element.bind("plotclick", function (event, pos, item) {
  70         var key = ticks[item.datapoint[1]][1];
  71         var index = item.seriesIndex;
  72         line_graph($("#line"), labels, kvslist, key, index);
  73     });
  74 }
  75 horizontal_bar_graph($("#bar"), memory_labels, memory, memory.length - 1);
  76 </script>
  77 </body>
  78 </html>