title: Not able to use symbols in d3 chart
body: <p>I am using d3 chart in my project version used is version 4,</p>
  
  <p>My Code sandbox - <a href="https://codesandbox.io/s/lucid-morning-bi9vc" rel="nofollow noreferrer">https://codesandbox.io/s/lucid-morning-bi9vc</a></p>
  
  <p>I am trying to use the triangle symbol in place of my circle in my line chart</p>
  
  <p>code -</p>
  
  <pre><code>g.selectAll(".point")
        .data(data)
        .enter()
        .append("path")
        .attr("d", d3.symbolTriangle)
        .attr("transform", function(d) {
          return (
            "translate(" + xScale(d.startTime) + "," + yScale(d.magnitude) + ")"
          );
        })
        .style("fill", "red")
        .attr("class", "point");
  </code></pre>
  
  <p>Previously for circle - this was working fine for circle.</p>
  
  <pre><code>g.selectAll("circle")
        .data(data)
        .enter()
        .append("circle")
        .attr("cx", function(d) {
          return xScale(d.startTime);
        })
        .attr("cy", function(d) {
          return yScale(d.magnitude);
        })
        .attr("r", function(d) {
          return 6;
        })
  </code></pre>
  
  <p>I have followed this  -</p>
  
  <p><a href="https://bl.ocks.org/mbostock/3244058" rel="nofollow noreferrer">https://bl.ocks.org/mbostock/3244058</a>
  to use like <code>.attr("d", d3.svg.symbol().type("triangle-up"))</code> but this also don’t work.</p>
  
  <p>I tried to refer <a href="https://bl.ocks.org/feyderm/4d143591b66725aed0f1855444752fd9" rel="nofollow noreferrer">https://bl.ocks.org/feyderm/4d143591b66725aed0f1855444752fd9</a> and symbol link <a href="https://github.com/d3/d3-shape#symbols" rel="nofollow noreferrer">https://github.com/d3/d3-shape#symbols</a> but I am not able to use it successfully, Any guidance. Thanks.</p>