title: Add arrow to both sides of line in D3
body: <p>I am new for D3. How can I add an arrow to the beginning and to the end of this line?</p>
  
  <pre><code>var x = 100;
  var y = 100;
  
  var canvas = d3.select("#canvasContainer")
              .append("svg")
              .attr("width", 600)
              .attr("height", 500);
  var line1 = canvas.append("line")
              .attr("x1", x)
              .attr("y1", y)
              .attr("x2", x)
              .attr("y2", y + 50)
              .attr("stroke", "red")
              .attr("stroke-width", "3");
  </code></pre>