title: Proper format for drawing polygon data in D3
body: <p>I've tried this different ways, but nothing seems to be working. Here is what I currently have:</p>
  
  <pre><code>var vis = d3.select("#chart").append("svg")
           .attr("width", 1000)
           .attr("height", 667),
  
   scaleX = d3.scale.linear()
          .domain([-30,30])
          .range([0,600]),
  
  scaleY = d3.scale.linear()
          .domain([0,50])
          .range([500,0]),
  
  poly = [{"x":0, "y":25},
          {"x":8.5,"y":23.4},
          {"x":13.0,"y":21.0},
          {"x":19.0,"y":15.5}];
  
  vis.selectAll("polygon")
      .data(poly)
      .enter()
      .append("polygon")
      .attr("points",function(d) { 
          return [scaleX(d.x),scaleY(d.y)].join(",")})
      .attr("stroke","black")
      .attr("stroke-width",2);
  </code></pre>
  
  <p>I assume the problem here is either with the way I am defining the points data as an array of individual point objects, or something to do with how I'm writing the function for the <code>.attr("points",...</code></p>
  
  <p>I've been looking all over the web for a tutorial or example of how to draw a simple polygon, but I just can't seem to find it.</p>