Javascript 具有数据驱动宽度限制的D3字包装

在D3中创建一些文本并进行文字包装非常简单：

var textElement = svg.selectAll('text')
                   .data(myData)
                   .enter()
                   .append('text')
                   .text(someVeryLongText)
                   .call(wrapText, allowedWidth);

wrapText（）函数是使用其中一个相当标准的示例（例如）实现的

我遇到的问题是，当我想使每个文本字段的允许宽度取决于基准时，例如：

                   ...
                   .text(someVeryLongText)
                   .call(wrapText, function(d) {
                     return d.someCondition ? 100 : 200;
                   });

---

这样的事情可能吗

调整链接示例中的wrap函数，如下所示，并在帖子中使用所需的调用签名。工作示例

---

请记住，如果已经存在tspan元素，则在其当前形式中它将中断。但是如果你稍微调整一下，它很容易修复。

function wrap(text, width) {
    text.each(function(d, i/*[edit]*/) {
        var text = d3.select(this),
            words = text.text().split(/\s+/).reverse(),
            word,
            line = [],
            lineNumber = 0,
            lineHeight = 1.1, // ems
            y = text.attr("y"),
            dy = parseFloat(text.attr("dy")),
            tspan = text.text(null).append("tspan").attr("x", 0).attr("y", y).attr("dy", dy + "em"),
            //[edit]add dWidth
            dWidth = typeof width === "function" ? width(d, i) : width;
        while (word = words.pop()) {
            line.push(word);
            tspan.text(line.join(" "));
            if (tspan.node().getComputedTextLength() > dWidth/*[edit]*/) {
                line.pop();
                tspan.text(line.join(" "));
                line = [word];
                tspan = text.append("tspan").attr("x", 0).attr("y", y).attr("dy", ++lineNumber * lineHeight + dy + "em").text(word);
            }
        }
    });
}