D3.js 将tspan放入矩形D3JS SVG中

我在使用D3JS的数据可视化项目中工作

我必须把一些信息放在一个矩形内，我使用wrap函数分割内容，不，我想把每一行（tspan）放在一个矩形内。我不知道该怎么做，我很感激你的帮助

小矩形将包含信息。有没有人举个例子来说明这一点。thakns在那里！ 实际上，您需要做的是为组设置正确的位置

    var data = [0,1,2,3,4]; // example data
    var selection = svg.selectAll('g').data(data).enter();

    // set position for rects and texts using transform-translate 
    var groups = selection.append('g')
                          .attr('transform', function(d, i) { return 'translate(0,' + i * 35 + ')' });

    groups.append('rect')
          .attr('width', 100)
          .attr('height', 30)
          .attr('fill', 'white')
          .attr('stroke', 'black'); // all rects

    groups.append('text')
          .text((d) => d)
          .attr('font-size', '10px')
          .attr('y', 15); // all texts

---

另外，对您来说，可能会有帮助。

首先，根据its文档，一个

tspan

只能在

text

元素中。那么，您能否提供一些代码来展示您已经尝试过的内容，并帮助我们为您提供指导？您可能会在web上找到许多嵌套矩形的示例（包括stackoverflow），但帮助您的并不在于提供这样一个链接。我强烈建议您使用它，这将为您带来很多困难。