Is there anything like Array.map() for a D3 selection? To find the maximum length of a selection of SVG <text/> elements, I currently do the following. However .selectAll(...)[0].map(...) seems like a hack to me. Is there a better way?

      var chi = svg.selectAll('.chi');

      var xChi = d3.max(chi[0].map(function (itm) { return itm.getComputedTextLength(); }));

I can use selection.each() to iterate a function over a selection, but I'm not sure how to bine this with d3.max(). I tried d3.max(chi.each(function (itm) { return itm.getComputedTextLength(); })), but d3.each() doesn't return an array of the return values

Is there anything like Array.map() for a D3 selection? To find the maximum length of a selection of SVG <text/> elements, I currently do the following. However .selectAll(...)[0].map(...) seems like a hack to me. Is there a better way?

      var chi = svg.selectAll('.chi');

      var xChi = d3.max(chi[0].map(function (itm) { return itm.getComputedTextLength(); }));

I can use selection.each() to iterate a function over a selection, but I'm not sure how to bine this with d3.max(). I tried d3.max(chi.each(function (itm) { return itm.getComputedTextLength(); })), but d3.each() doesn't return an array of the return values

• javascript
• svg
• selector
• d3.js

2 Answers 2

var allLength

d3.selectAll(".element")
.each(function(d, i) {allLength[i]=d3.select(this).node().getComputedTextLength() })

var maxLength = d3.max(a)

Yea..that bracket makes my eyes sore too.

d3.max(svg.selectAll('.chi').pop(), function(item) {
  return itm.getComputedTextLength()
})

The question was from 2012. I don't know what d3 was like back then, but the current version has d3.max accepts an accessor function to retrieve the value you're max-ing.