I'm using this for a simple visualisation.

I want to add the country's name to each path. I've tried to loop over countries, but I have no idea how to link with the SVG.

var world = svg.selectAll("path.land")
            .data(countries)
            .enter().append("path")
            .attr("class", "land")
            .attr("d", path)

I'm using this for a simple visualisation.

http://bl.ocks/KoGor/5994804

I want to add the country's name to each path. I've tried to loop over countries, but I have no idea how to link with the SVG.

var world = svg.selectAll("path.land")
            .data(countries)
            .enter().append("path")
            .attr("class", "land")
            .attr("d", path)

• javascript
• svg
• d3.js

• What exactly are you trying to do? Add another class to the generated paths or add text on the globe? – Lars Kotthoff Commented Feb 6, 2015 at 15:14
• I want to add class to the path, for example <path class="land india" d="..."> jsfiddle/7buzp4ab here you have the code live – Marius Commented Feb 6, 2015 at 15:15
• 1 This would be simply .attr("class", function(d) { return "land " + d.properties.name; }), no? – Lars Kotthoff Commented Feb 6, 2015 at 15:27

1 Answer 1

You can use a function to build the class attribute dynamically for each data item:

var world = svg.selectAll("path.land")
            .data(countries)
            .enter().append("path")
            .attr("class", function(d) { return "land " + d.name })
            .attr("d", path)