title: Drawing from a csv in D3
body: <p>I am trying to draw circles from a csv that has a bunch of x and y coordinates in it. I am new to D3 and don't know where to go next. here is the code</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;script type="text/javascript"&gt;
  
  d3.xml("brussels3.svg", "image/svg+xml", function(xml) {
     document.body.appendChild(xml.documentElement);
  
  d3.csv("brusselsconverteddata.csv")
      .row(function(d) { return {key: +d.key, value: +d.value}; })
      .get(function(error, rows) { console.log(rows); });
  
     var svg = d3.select('svg');
  
     svg.append("circle")
      .style("stroke", "gray")
      .style("fill", "black")
      .attr("r", 15)
      .attr("cx", 2142)
      .attr("cy", 2209)
      .on("mouseover", function(){d3.select(this).style("fill", "aliceblue");})
      .on("mouseout", function(){d3.select(this).style("fill", "black");});
  
  
  });
  
  
  
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I am not sure how to iterate over the list of coordinates in D3. I am confused as to what to put in the cx and cy .attr to iterate the list. </p>