D3 Examples - D3 Wordcloud

xxxxxxxxxx
 
<html>
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
    <script src="cloud.js"></script>
  </head>
  <body>
    <div id="words"></div>
    <div id="chart"></div>
    <script>
      var text_string = `
Allgemeine Geschäftsbedingungen 
`;
​
      drawWordCloud(text_string);
​
      function drawWordCloud(text_string){
        var common = "die, ihr, ihre, und, sie, oder, nicht, wir, für, mit, diese, in, auf, unser, unsere, sein, wie, ist, den, von, das, dass, zu, sind, haben, ein, eine, können, dem, den, denen, ihnen, bei, durch, werden, desse, ihres, ihren, unserer, auch, als, kann, dessen, wird, einer, damit, bis, hat, ihrem, dieser, über, sich , sowie, aber, um, im, einem, per, dann, zur, wir, vor, nach, hinsichtlich, bzw, diesen, unseren, alle, seine, einige, aus, ihre, wo, oder, nur, wenn, würde";
            // "poop,i,me,my,myself,we,us,our,ours,ourselves,you,your,yours,yourself,yourselves,he,him,his,himself,she,her,hers,herself,it,its,itself,they,them,their,theirs,themselves,what,which,who,whom,whose,this,that,these,those,am,is,are,was,were,be,been,being,have,has,had,having,do,does,did,doing,will,would,should,can,could,ought,i'm,you're,he's,she's,it's,we're,they're,i've,you've,we've,they've,i'd,you'd,he'd,she'd,we'd,they'd,i'll,you'll,he'll,she'll,we'll,they'll,isn't,aren't,wasn't,weren't,hasn't,haven't,hadn't,doesn't,don't,didn't,won't,wouldn't,shan't,shouldn't,can't,cannot,couldn't,mustn't,let's,that's,who's,what's,here's,there's,when's,where's,why's,how's,a,an,the,and,but,if,or,because,as,until,while,of,at,by,for,with,about,against,between,into,through,during,before,after,above,below,to,from,up,upon,down,in,out,on,off,over,under,again,further,then,once,here,there,when,where,why,how,all,any,both,each,few,more,most,other,some,such,no,nor,not,only,own,same,so,than,too,very,say,says,said,shall";
​
        var word_count = {};
​
        var words = text_string.split(/[ '\-\(\)\*":;\[\]|{},.!?]+/);
          if (words.length == 1){
            word_count[words[0]] = 1;
          } else {
            words.forEach(function(word){
              var word = word.toLowerCase();
              if (word != "" && common.indexOf(word)==-1 && word.length>1){
                if (word_count[word]){
                  word_count[word]++;
                } else {
                  word_count[word] = 1;
                }
              }
            })
          }
​
        var svg_location = "#chart";
        var width =  $(document).width();
        var height = $(document).height();
​
        var fill = d3.scale.category20();
        
        var my_fills = ["#727272", "#919191", "#3f3f3f", "#474747", "#898989", "#727272"];
​
        var word_entries = d3.entries(word_count);
        
        word_entries = [
{"key": "Rücktritt", "value": 38},
{"key": "Streaming", "value": 20},
{"key": "Lieferung", "value": 20},
{"key": "Dienste", "value": 41},
{"key": "AGB", "value": 40},
{"key": "Konto", "value": 19},
{"key": "Dateien", "value": 11},
{"key": "Datenschutz", "value": 15},
{"key": "Privatsphäre", "value": 20},
{"key": "Mail", "value": 10},
{"key": "Recht", "value": 9},
{"key": "Schiedsverfahren", "value": 8},
{"key": "Tochtergesellschaften", "value": 8},
{"key": "Absatz", "value": 7},
{"key": "Zugriff", "value": 7},
{"key": "behalten", "value": 6},
{"key": "Organisation", "value": 6},
{"key": "Adresse", "value": 6},
{"key": "Gesetze", "value": 6},
{"key": "verwenden", "value": 6},
{"key": "zulässig", "value": 5},
{"key": "Diensten", "value": 5},
{"key": "Inhalt", "value": 5},
{"key": "Verwendung", "value": 5},
{"key": "Schiedsvereinbarung", "value": 5},
{"key": "Datum", "value": 4},
{"key": "Benachrichtigung", "value": 4},
{"key": "rechtzeitig", "value": 4},
{"key": "erklären", "value": 4},
{"key": "kündigen", "value": 4},
{"key": "Gebühren", "value": 24},
{"key": "Nutzer", "value": 4},
{"key": "Team", "value": 4},
{"key": "Lizenz", "value": 4},
{"key": "freigeben", "value": 4},
{"key": "nutzen", "value": 4},
{"key": "Schäden", "value": 8},
{"key": "voraus", "value": 4},
{"key": "haften", "value": 4},
{"key": "Klage", "value": 4},
{"key": "streitigkeit", "value": 4},
{"key": "Nutzung", "value": 4},
{"key": "Nutzern", "value": 3},
{"key": "zahlungspflichtiges", "value": 3},
{"key": "Abos", "value": 32},
{"key": "Software", "value": 3},
{"key": "Ländern", "value": 3},
{"key": "Genehmigung", "value": 3},
{"key": "Zeit", "value": 3},
{"key": "beispielsweise", "value": 3},
{"key": "Gesetzes", "value": 3},
{"key": "wegen", "value": 3},
{"key": "EU", "value": 3},
{"key": "innerhalb", "value": 3},
{"key": "Tagen", "value": 3},
{"key": "bleibt", "value": 3},
{"key": "Funktionen", "value": 3},
{"key": "einverstanden", "value": 3},
{"key": "unterliegen", "value": 3},
{"key": "beschränken", "value": 3},
{"key": "bedingungen", "value": 3},
{"key": "Vereinbarung", "value": 3},
{"key": "Haftung", "value": 3},
{"key": "verantwortlich", "value": 3},
{"key": "bemühen", "value": 3},
{"key": "Zulieferer", "value": 3},
{"key": "gilt", "value": 3},
{"key": "Anspruch", "value": 23},
{"key": "entsprechen", "value": 3},
{"key": "Nutzungsbedingungen", "value": 25},
{"key": "Geschäftsbedingungen", "value": 15},
{"key": "Inkrafttretens", "value": 3},
{"key": "Land", "value": 3},
{"key": "umwandeln", "value": 3},
{"key": "Gültigkeit", "value": 3},
{"key": "dürfen", "value": 3},
{"key": "Entscheidung", "value": 3},
{"key": "anstrengen", "value": 3},
{"key": "geltend", "value": 3},
{"key": "Klausel", "value": 25},
{"key": "Konten", "value": 21},
{"key": "Speicherplatz", "value": 8},
{"key": "geschützt", "value": 7},
{"key": "herunterladen", "value": 6},
{"key": "verstoßen", "value": 2},
{"key": "Speicherplatz", "value": 2},
{"key": "leben", "value": 2},
{"key": "schließen", "value": 2},
{"key": "stellen", "value": 2},
{"key": "Inhalte", "value": 2},
{"key": "geistigen", "value": 2},
{"key": "Kündigung", "value": 2},
{"key": "Abo", "value": 22},
{"key": "erfolgt", "value": 2},
{"key": "geschützt", "value": 2},
{"key": "steuern", "value": 2},
{"key": "einigen", "value": 2},
{"key": "Regeln", "value": 2},
{"key": "herunterladen", "value": 2},
{"key": "Vorrang", "value": 2},
{"key": "Erstattung", "value": 2},
{"key": "keinerlei", "value": 2},
{"key": "informationen", "value": 2},
{"key": "abgesehen", "value": 2},
{"key": "einhaltung", "value": 2},
{"key": "allerdings", "value": 2},
{"key": "verpflichtet", "value": 2},
{"key": "rechten", "value": 2},
{"key": "kostenpflichtiges", "value": 2},
{"key": "halten", "value": 2},
{"key": "gemäß", "value": 2},
{"key": "sperren", "value": 2},
{"key": "benachrichtigen", "value": 2},
{"key": "verknüpft", "value": 2},
{"key": "freuen", "value": 2},
{"key": "Rahmen", "value": 2},
{"key": "Aufforderung", "value": 2},
{"key": "Kontrolle", "value": 2},
{"key": "bieten", "value": 2},
{"key": "Administratoren", "value": 2},
{"key": "Teamkonto", "value": 2},
{"key": "gestattet", "value": 2},
{"key": "unterbinden", "value": 2},
{"key": "auszusetzen", "value": 2},
{"key": "beenden", "value": 2},
{"key": "zählen", "value": 2},
{"key": "Vorschriften", "value": 2},
{"key": "client", "value": 2},
{"key": "verknüpfte", "value": 2},
{"key": "automatisch", "value": 2},
{"key": "exportieren", "value": 2},
{"key": "inkrafttreten", "value": 2},
{"key": "vorherige", "value": 2},
{"key": "gesetzliche", "value": 2},
{"key": "bereitzustellen", "value": 2},
{"key": "Bereitstellung", "value": 2},
{"key": "falle", "value": 2},
{"key": "gesetzlichen", "value": 2},
{"key": "bezahlten", "value": 2},
{"key": "erhalten", "value": 2},
{"key": "allgemeinen", "value": 2},
{"key": "aufheben", "value": 2},
{"key": "Distributoren", "value": 2},
{"key": "Garantien", "value": 2},
{"key": "erläuterten", "value": 2},
{"key": "Haftungsausschlüsse", "value": 2},
{"key": "Haftungsbeschränkung", "value": 2},
{"key": "rechtlich", "value": 2},
{"key": "Verträge", "value": 7},
{"key": "entgangene", "value": 2},
{"key": "betrags", "value": 2},
{"key": "einreichen", "value": 2},
{"key": "informelle", "value": 2},
{"key": "Beilegung", "value": 2},
{"key": "Urheberrecht", "value": 2},
{"key": "Marken", "value": 2},
{"key": "Verfahren", "value": 2},
{"key": "Bezug", "value": 2},
{"key": "Ansprüche", "value": 2},
{"key": "verpflichtenden", "value": 2},
{"key": "Schiedsbestimmungen", "value": 2},
{"key": "eventuell", "value": 2},
{"key": "zugreifen", "value": 2},
{"key": "anderer", "value": 2},
{"key": "Gerichtsstand", "value": 2},
{"key": "erteilen", "value": 2},
{"key": "wohnhaft", "value": 2},
{"key": "örtlichen", "value": 2},
{"key": "Benachrichtigungen", "value": 2},
{"key": "Schlichter", "value": 2},
{"key": "Schiedsbestimmungen", "value": 2},
{"key": "Urheberrechtsverletzungen", "value": 2},
{"key": "Gesetz", "value": 2},
{"key": "Nichteinverständnis", "value": 2},
{"key": "vorherigen", "value": 2},
{"key": "entscheiden", "value": 2},
{"key": "arbitration", "value": 2}      ];        
        
        var xScale = d3.scale.sqrt()
           .domain([2, d3.max(word_entries, function(d) {
              return d.value;
            })
           ])
           .range([10,45]);
​
        d3.layout.cloud().size([width, height])
          .timeInterval(20)
          .words(word_entries)
          .fontSize(function(d) { return xScale(+d.value); })
          .text(function(d) { return d.key; })
          .rotate(function() { return 0 }) //~~(Math.random() * 2) * 90; })
          .font("Arial Black")
          .on("end", draw)
          .start();
​
        function draw(words) {
          d3.select(svg_location).append("svg")
              .attr("width", width)
              .attr("height", height)
            .append("g")
              .attr("transform", "translate(" + [width >> 1, height >> 1] + ")")
            .selectAll("text")
              .data(words)
            .enter().append("text")
              .style("font-size", function(d) { return xScale(d.value) + "px"; })
              .style("font-family", "Arial Black") // "Impact")
//              .style("fill", function(d, i) { return fill(i); })
              .style("fill", function(d, i) { return my_fills[i % my_fills.length]; })
//              .style("fill", function(d, i) { return "#727272"; })
              .attr("text-anchor", "middle")
              .attr("transform", function(d) {
                return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
              })
              .text(function(d) { return d.key; });
        }
​
        d3.layout.cloud().stop();
        
        word_entries.sort(function(x, y){
          return d3.descending(x.value, y.value);
        })        
        
//        d3.select("#words")
  //        .selectAll("div")
    //      .data(word_entries)
      //    .enter().append("div")
        //  .text(function(d) { return "{\"key\": \"" + d.key + "\", \"value\": " + d.value + "},\n"; });
      }
    </script>
  </body>
</html>
    