title: D3 JS Displaying Text Next To Circle
body: <p>I am new to D3 and I am trying to modify some sample code.  I can display a geo map, limit it to the US, draw circles for each of the cities I want represented but I can't figure out how to display text next to those circles.  When I inspect the page I can see that D3 has created a child element in the path and it has the name of the city but I can't seem to make it appear.  Any help is greatly appreciated. Here is the code I am working with:</p>
  
  <pre>
  
      
      .states {
        fill: #ccc;
        stroke: #fff;
      }
      .symbol {
        fill: steelblue;
        fill-opacity: .8;
        stroke: #fff;
      }
      
      
      
      
      
      
  
      var width = 960,
          height = 500;
  
      var radius = d3.scale.sqrt()
          .domain([0, 1e6])
          .range([0, 10]);
  
      var path = d3.geo.path();
  
      var svg = d3.select("body").append("svg")
          .attr("width", width)
          .attr("height", height);
  
      queue()
          .defer(d3.json, "us.json")
          .defer(d3.json, "us-state-centroids.json")
          .await(ready);
  
      function ready(error, us, centroid) {
        svg.append("path")
              .attr("class", "states")  
              .datum(topojson.feature(us, us.objects.states))
              .attr("d", path);
  
      var symbols =  svg.selectAll(".symbol")
              .data(centroid.features.sort(function(a, b) { return b.properties.population - a.properties.population; }))
              .enter().append("path")
              .attr("class", "symbol")
              .attr('pointer-events', 'all')
              .on("mouseover", function (b) {
                  d3.selectAll('.line_over').style("display", "block");
              })
              .attr("d", path.pointRadius(function(d) { return radius(d.properties.population); }))       
  
      symbols.append("text")
           .text(function(d){
                          return d.properties.name;
                      })
      }
  
      
  
  </pre>