Javascript 如何在带有D3JS的SVG中正确使用use标记？

我知道d3根据调用的顺序渲染元素。因此，如果我想在黑色矩形上呈现白色文本，我可以先调用rect，然后调用白色文本

然而，在我的特殊情况下，我的rect的维度基于我的白色文本，所以我必须首先调用白色文本

我发现的一个变通方法是使用使用标记，但我无法让它工作，以下是我当前的尝试：

案文：

      var textToolTip = gToolTip
        .append("text")

        .attr("id", "toUse")
        .text(.....)...

使用标签：

var useText = gToolTip.append("use").attr("xlink:xlink:href", "#toUse");

---

我也尝试过给出文本工具提示xlink:href，但没有成功。对于use标记，我尝试使用xlink:href而不是xlink:xlink:href，但没有成功。我之所以使用double xlink，是因为我发现了这样一个答案：

如果我理解正确，添加矩形、添加文本，然后根据文本调整矩形的大小会更简单：

var svg=d3.select（'svg'）；
var rect=svg.append（“rect”）
.样式（“填充”、“黑色”）
.attr（“x”，20）
.attr（“y”，20）；
var text=svg.append（“文本”）
.text（“现在是所有好人来帮助他们国家的时候了”）
.attr（“x”，20）
.attr（“y”，20）
.attr（“路线基线”、“悬挂”）
.样式（“填充”、“钢蓝”）
.style（“字体系列”、“arial”）
.style（“字体大小”、“14磅”）
var bbox=text.node（）.getBBox（）；
矩形属性（“宽度”，bbox.width）；
矩形属性（“高度”，bbox.height）；

为什么不这样做？