如何在D3.js中的每个弧线上换行文本？

// 创建SVG容器
var svg = d3.select("body")
  .append("svg")
  .attr("width", 500)
  .attr("height", 500);

// 创建弧生成器
var arc = d3.arc()
  .innerRadius(100)
  .outerRadius(200);

// 创建弧线的数据集
var data = ["This is a long text that needs to be wrapped", "This is another long text"];

// 计算角度
var pie = d3.pie()(data);

// 生成路径
var paths = svg.selectAll("path")
  .data(pie)
  .enter()
  .append("path")
  .attr("d", arc);

// 创建文本元素
var texts = svg.selectAll("text")
  .data(pie)
  .enter()
  .append("text")
  .attr("transform", function(d) {
    return "translate(" + arc.centroid(d) + ")";
  });

// 设置文本内容
texts.append("tspan")
  .text(function(d) {
    return d.data;
  })
  .attr("x", 0)
  .attr("dy", "-0.5em");

// 设置换行文本
texts.append("tspan")
  .text(function(d) {
    return d.data;
  })
  .attr("x", 0)
  .attr("dy", "1em");