d3.js - path.centroid error: path is undefined

Question

I´still working on my project. I try to add some circles to my map from a geojson file with the circles add the center of the paths. My Webinspektor says path is undefined :-( I think he is right but I can´t figure out why. Thank you for your helping.

Here is the code:

overlayBeschaeftigte.afterAdd = function () {
                    var div = d3.selectAll("#" + overlayBeschaeftigte.div.id);
                        //get the vector layer div element

                    div.selectAll("svg").remove();                  //remove the existing svg element and create a new one

                    var svg = div.append("svg");

                    var group = svg.append("g");
                    var bounds = d3.geo.bounds(collection);

                    var path = d3.geo.path()
                        .projection(project);

                    var feature  = group.selectAll("path")
                        .data(collection.features)
                        .enter()
                        .append("path")
                    group.selectAll("circle")
                        .data(collection.features)
                        .enter()
                        .append("circle")
                        .attr('cx', function(d) {
                             var x = path.centroid(d)[0];
                             return x;

                        })
                        .attr('cy', function(d) {
                             var y = path.centroid(d)[1];
                             return y;
                        })
                        .attr('r', 15)
                        .style("fill", "yellow")
                        .style("opacity", 0.75) 
                }