d3.js——文本换行

常规设置：

 var width = 400,
            height = 400;
    var str = "云中谁寄锦书来，雁字回时，月满西楼";
    var svg = d3.select("body").append("svg")
            .attr("width",width)
            .attr("height",height)

如果需要文本显示换行，首先使用split将字符串分为几段：

 var strs = str.split("，")

然后在text下添加“tspan”元素，并完成其x和dy属性的赋值操作即可实现，如下：

 var text = svg.append("text")
            .attr("font-size","14px")
            .attr("x",30)
            .attr("y",100)
            .text(str)
    var texts = text.selectAll("tspan")
            .data(strs)
            .enter()
            .append("tspan")
            .attr("x",text.attr("x"))
            .attr("dy","1em")
            .text(function(d){return d})

运行结果如下：