D3 Examples - star-coordinates

xxxxxxxxxx
 
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>
​
<body>
  <script>
    // Feel free to change or delete any of the code you see in this editor!
        
        var height = 500;
    var width = 960;
    var radius = width/2;
    var origin_x = height/2;
    var origin_y = width/2;
    var svg = d3.select("body").append("svg")
      .attr("width", width)
      .attr("height", height);
        var dispatch = d3.dispatch("load_topics_id")
    
    d3.json("hdp_topics_id.json",function(err,hdp_topics_id){
      if (err){
        throw err;
      }
        
      
    d3.json("hdp_topics.json",function(err,data){
      if (err){
        throw err;
      }
        
        var axis ={};
        hdp_topics_id.forEach(function(d,i){
          axis[d]={
                            "x":radius*Math.sin(Math.PI*2*i/hdp_topics_id.length),
                    "y":radius*Math.cos(Math.PI*2*i/hdp_topics_id.length)
                        }
        })
 
                data.forEach(function(d,i){
          var x = d3.sum(d["hdp_topics"],function(el){
            if(axis[el.topic_id]){
                return el.topic_prob*axis[el.topic_id]["x"];
            }else
              {
                console.log("SomEthing horrible happened. Call the cops")
              }
                               
          }) + origin_x;
          
          var y = d3.sum(d["hdp_topics"],function(el){
            return el.topic_prob*axis[el.topic_id]["y"];
          }) + origin_y;
          
          data[i]["x"] = x;
          data[i]["y"] = y;
            
          console.log("ok");
          });
        
        
        
      });
      
    })
      
    
  </script>
</body>
​
    