Word Graph

(function(){

  var util = {
    getWordsForElement: function(elem) {
      var words = {};

      if(elem.innerText){
        // split text into words... removing any special characters we don't want
        var pieces = elem.innerText.toLowerCase().replace(/[^A-Za-z\-'\s]/g, '').split(/\s/);

        for(var i = 0; i < pieces.length; i++){
          var piece = pieces[i];

          // don't add too short strings or numbers to our list
          if(!piece || piece.length < 4 || piece.match(/[\d\-']+/))
            continue;

          if(words[piece]){
            words[piece]++;
          } else {
            words[piece] = 1;
          }
        }
      }

      for(var i = 0; i < elem.children.length; i++){
        util.merge(words, util.getWordsForElement(elem.children[i]));
      }

      return words;
    },
    merge: function(target, source) {
      var sourceNames = Object.getOwnPropertyNames(source);

      for(var i = 0; i < sourceNames.length; i++){
        var name = sourceNames[i];

        if(target[name]){
          target[name] += source[name];
        } else {
          target[name] = source[name];
        }

      }
    }
  }; // util end

  var wordCounts = getWordsForElement(document.body);
  var words = Object.getOwnPropertyNames(wordCounts).sort(function(a, b) {
    if (a < b) //sort string ascending
      return -1;
    if (a > b)
      return 1;

    return 0;
  });

  var max = wordCounts[words[0]];
  var min = wordCounts[words[0]];

  for(var i = 1; i < words.length; i++){
    if(wordCounts[words[i]] > max)
      max = wordCounts[words[i]];
    if(wordCounts[words[i]] < min)
      min = wordCounts[words[i]];
  }

  var minFont = 8;
  var maxFont = 50;

  var wrapper = document.createElement('div');
  wrapper.style.cssText = 'position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10000; padding: 100px; background-color: rgba(255, 255, 255, 0.9); display: flex; flex-wrap: wrap; align-items: baseline;';

  for(var i = 0; i < words.length; i++) {

    var element = document.createElement('div');
    element.style.cssText = 'color: #154394; padding: 0 10px;';
    element.innerText = words[i];
    element.style.fontSize = Math.round(((maxFont - minFont) * (wordCounts[words[i]] / (max - min))) + minFont) + 'px';

    wrapper.appendChild(element);
  }

  document.body.prepend(wrapper);

})();