daily pastebin goal
30%
SHARE
TWEET

svg

juanpa_1982 Oct 4th, 2015 99 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1.  
  2. var colCounter = 0;
  3. var rowCounter = 0;
  4. var redShades = {
  5.     "D": "#7D000E",
  6.     "u": "#990515",
  7.     "a": "#E0082D",
  8.     "d": "#E9967A",
  9.     "s": "#CC0000",
  10.     "C": "#DC143C",
  11.     "A": "#FF0000",
  12.     "S": "#B22222",
  13.     "E": "#8B0000",
  14.     "": "#00D030"
  15. };
  16. var newWidth = 1000;
  17. var svgElement = null;
  18. var side;
  19. var loading = false;
  20.  
  21. function createHeatMap() {
  22.     "use strict";
  23.     svgElement = document.getElementById("heat-map-svg");
  24.     if (svgElement === null) {
  25.         svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg");
  26.         svgElement.setAttribute("height", "1000");
  27.         svgElement.setAttribute("id", "heat-map-svg");
  28.         document.getElementById("heat-map").appendChild(svgElement);
  29.     }
  30. }
  31.  
  32. function createNode(node) {
  33.     "use strict";
  34.     var x;
  35.     var y;
  36.     var colour;
  37.     var rectElement = document.createElementNS("http://www.w3.org/2000/svg", "rect");
  38.     var bad = null;
  39.  
  40.     if ((colCounter * side) <= newWidth) {
  41.         x = colCounter * side;
  42.         y = rowCounter * side;
  43.         colCounter++;
  44.     } else {
  45.         rowCounter++;
  46.         colCounter = 1;
  47.         x = 0;
  48.         y = rowCounter * side;
  49.     }
  50.  
  51.     rectElement.setAttribute("x", x);
  52.     rectElement.setAttribute("y", y);
  53.     rectElement.setAttribute("width", side);
  54.     rectElement.setAttribute("height", side);
  55.     if (node.queueList.length) {
  56.         _.each(node.queueList, function (queue) {
  57.             if (queue.state !== "") {
  58.                 bad = queue.state;
  59.             }
  60.         });
  61.         colour = bad ? redShades[bad.charAt(0)] : "#00D030";
  62.     } else {
  63.         colour = "#000000";
  64.     }
  65.     rectElement.setAttribute("title", node.hostname);
  66.     rectElement.setAttribute("fill", colour);
  67.     rectElement.setAttribute("stroke-width", 1);
  68.     rectElement.setAttribute("stroke", "#008000");
  69.     rectElement.setAttribute("data-id", node._id._str);
  70.     svgElement.appendChild(rectElement);
  71. }
  72.  
  73. function populateHeatMap(data) {
  74.     "use strict";
  75.  
  76.     side = Math.floor(1000 / Math.ceil(Math.sqrt(data.counter)));
  77.     if (1000 % side) {
  78.         newWidth = Math.ceil(1000 / side) * side;
  79.     }
  80.  
  81.     if (svgElement) {
  82.         svgElement.innerHTML = "";
  83.     }
  84.     $("div#heat-map").width(newWidth);
  85.     svgElement.setAttribute("width", newWidth);
  86.     _.each(data.data, createNode);
  87.  
  88. }
  89.  
  90. function getHeatMapData() {
  91.     "use strict";
  92.  
  93.     Meteor.call("heatMap", function (error, result) {
  94.         if (error) {
  95.             console.error(error);
  96.         }
  97.         if (result) {
  98.             populateHeatMap(result);
  99.             if (loading) {
  100.                 Blaze.remove(loading);
  101.                 loading = false;
  102.             }
  103.         }
  104.     });
  105. }
  106.  
  107. Template.heatMap.onRendered(function () {
  108.     "use strict";
  109.     var $ul = this.$("ul");
  110.     loading = Blaze.render(Template.loading, document.getElementById("heat-map"));
  111.     createHeatMap()
  112.     getHeatMapData();
  113.     $ul.find("li.active").removeClass("active");
  114.     $ul.find("button[data-type='heat-map']").closest("li").addClass("active");
  115.     Meteor.setInterval(getHeatMapData, 10000);
  116. });
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand