SOURCE

console 命令行工具 X clear

                    
>
console
var nodeData = [
  {name:"aaaa"},
  {name:"bbbb"},
  {name:"ssss"},
  {name:"dddd"}
];
var linkData = [
  {source:0,target:1},
  {source:0,target:2},
  {source:0,target:3},
];
var width = 500;
var height = 300;
var svg = d3.select("#forceMap").append("svg")
.attr("width",width)
.attr("height",height);

var forceGroup = svg.append("g");
var force = d3.layout.force()
.nodes(nodeData)
.links(linkData)
.size([width,height])
.linkDistance(150)
.charge([-150])
.alpha(0);

force.start();
var links = forceGroup.selectAll(".lineG")
.data(linkData)
.enter()
.append("g").attr('class','lineG').append('line')
.attr("stroke","#000");

var texts = d3.selectAll('.lineG').append('text')
.attr('class','text')
.style("fill", "#7d929c")
.text(function(d){
  return d.source.name + "---" + d.target.name
})
// .attr('transform','rotate(1)');

var nodes = forceGroup.selectAll("circle")
.data(nodeData)
.enter()
.append("circle")
.attr("r",5)
.attr("fill",function(d){
  if(d.weight == linkData.length){
    return "red"
  }else{
    return "green"
  }
});

function angle(start,end){
    var diff_x = end.x - start.x,
        diff_y = end.y - start.y;
    //返回角度,不是弧度
    return 360*Math.atan(diff_y/diff_x)/(2*Math.PI);
}

                           
force.on("tick",function(){
  links.attr("x1",function(d){ return d.source.x; })
                        .attr("y1",function(d){ return d.source.y; })
                        .attr("x2",function(d){ return d.target.x; })
                        .attr("y2",function(d){ return d.target.y; });

                    nodes.attr("cx",function(d){ return d.x; })
                        .attr("cy",function(d){ return d.y; });
  texts
  .attr('dy', function(d){
    return (d.target.y-d.source.y)/2+d.source.y
  })
  .attr('dx',function(d){
    return (d.target.x-d.source.x)/2+d.source.x
  });
})
<div id="forceMap">
  
</div>
#forceMap{
  width:500px;
  height:300px;
}