d3.js - d3 directed graph, how it works -

i'm trying insert d3 directed graph( this one ) thorax( super type of backbone ) view. able still have questions on way working(d3 code).

1. first create force layout passing nodes , edges

    var force = d3.layout.force() .nodes(nodes) .links(links) .size([width, height]) .linkdistance(150) .charge(-500) .on('tick', tick) 

   does create graph actually?

2. what these 2 lines do

   this.path = this.svg.append('svg:g').selectall('path'); this.circle = this.svg.append('svg:g').selectall('g'); 

   append svg:g element svg element. ok it. selectall. don't it. paths there? created force layout?

3. this.path = this.path.data(this.links); do? have no idea?

4. then append paths.

    this.path.enter().append('svg:path')  .attr('class', 'link')  .style('marker-start', function (d) {       return d.left ? 'url(#start-arrow)' : '';  })  .style('marker-end', function (d) {       return d.right ? 'url(#end-arrow)' : '';  }); 

5. then goes nodes. starting like

    this.circle = this.circle.data(this.nodes, function (d) {      return d.id;  }); 

6. create group first think because keep circle , label text together

   var g = this.circle.enter().append('svg:g'); 

7. now create circle.

   g.append('svg:circle')     .attr('class', 'node')     .attr('r', 12)     .style('stroke', _.bind(function (d) {          return d3.rgb(this.colors(d.id)).darker().tostring();     }, this))     .classed('reflexive', function (d) {          return d.reflexive;     }) 

8. append label text save group.

   g.append('svg:text')     .attr('x', 0)     .attr('y', 4)     .attr('class', 'id')     .text(function (d) {          return d.id;     }); 

so kind of overall idea of happening. not exactly. appreciate understanding better happening where.