title: Colour links of a d3 network graph according to a data variable
body: <p>I would like to colour different links of a network graph according to a value within a data vector (where each element of the vector corresponds to a particular link). I have tried something of the form:</p>
  
  <pre><code>var data = [1,1,1,2];
  
  var link = svg.selectAll(".link")
  .data(force.links())
  .enter()
  .append("line")
  .attr("class", "link")
  .attr("marker-end", "url(#end)")
  .on("mouseover", linkmouseover)
  .on("mouseout", linkmouseout);
  link.data(force.links()).enter().append(".link")
  .style("stroke", function(d,i){
  return ( (data[i]==2) ?
           "red" : "black" )
  });
  </code></pre>
  
  <p>However, this does not seem to work. If it's important I also have an svg styling: </p>
  
  <pre><code> .link {
  stroke: #ff0000;
  opacity: 0.6;
  stroke-width: 1.5px;
  }
  </code></pre>
  
  <p>Does anyone know why this isn't working? I have the Plunker version <a href="http://plnkr.co/edit/Rmc0XaDonCiIDfzMdlm5?p=preview" rel="nofollow">here</a>.</p>