title: D3: expand a polygon on a map
body: <p>I'm working on some different map visualizations on D3. I've got geoJson data and a map that has some .on("mouseover") functions to style it. </p>
  
  <p>Now, I'd like to expand the size of the polygon when I do a mouseover. With rectangles or circles I can just write a function to expand the width or radius. Does anyone know how to go about doing this?</p>
  
  <p>Here is an example of my code:</p>
  
  <pre><code>var svg = d3.select("#map")
    .append( "svg" )
    .attr( "width", width )
    .attr( "height", height );
  
  var g = svg.append( "g" );
  
  var albersProjection = d3.geo.albers()
    .scale( 190000 )
    .rotate( [71.057,0] )
    .center( [0, 42.313] )
    .translate( [width/2,height/2] );
  
  var geoPath = d3.geo.path()
      .projection( albersProjection );
  
  
  var mapProperties = g.selectAll( "path" )
    .data(data.features, function(d, i) {return d + i})
    .enter()
    .append( "path" )
    .attr( "fill", "#150000" )
    .attr( "d", geoPath )
    .style("stroke", "#FFFFFF")
    .style("stroke-width", 2)
  </code></pre>