title: How add vertical line to bar char in d3js?
body: <p>I´m noob using d3js I´m trying add a new vertical on Basic Horizontal Bar Chart of d3js. To test I´m using codepen but the vertical line is not shown.</p>
  
  <p>HTML file</p>
  
  <pre><code>&lt;head&gt;
    &lt;!-- Plotly.js --&gt;
    &lt;script src="http://d3js.org/d3.v3.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://cdn.plot.ly/plotly-latest.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;div id="myDiv" style="width: 480px; height: 400px;"&gt;&lt;!-- Plotly chart will be drawn inside this DIV --&gt;&lt;/div&gt;
   &lt;script&gt;
    &lt;!-- JAVASCRIPT CODE GOES HERE --&gt;
   &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>JS file</p>
  
  <pre><code>var trace1 = {
    x: [20],
    y: ['giraffes'],
    name: 'SF Zoo',
    orientation: 'h',
    marker: {
      color: 'rgba(55,128,191,0.6)',
      width: 1
   },
   type: 'bar'
  };
  
  var data = [trace1];
  
  var layout = {
    title: 'Colored Bar Chart',
    barmode: 'stack'
  };
  
  Plotly.newPlot('myDiv', data, layout);
  
  var y = d3.scale.linear().range([0, 400]);
  var svg = d3.select(document.getElementById('myDiv'));
  svg.append("line")
  .attr("x1", 10)
  .attr("y1", y(0))
  .attr("x2", 10)
  .attr("y2", y(1))
  .style("stroke", "black");
  </code></pre>