Javascript d3元素内的html标签

我编写了以下代码（这是一个玩具示例，在JSFIDLE上）来在悬停形状时显示标签：

var lbl;
var svg = d3.select("#chart").append("svg")
      .attr("width", 200)
      .attr("height", 200);
        svg.append("rect")
      .attr("x", 50)
      .attr("y", 0)
          .attr("width",50)
      .attr("height",50)
          .attr("label","first line"+"<br/>"+"second line")
      .style("fill", "yellow")  
          .on("mouseover",function() {
               var th=d3.select(this);
               lbl=svg.append("text")
                   .attr("x", th.attr("x")*1+th.attr("width")/2)
                   .attr("y", th.attr("y")*1+th.attr("height")/2)
                   .attr("dy", "0.5em")
                   .style("text-anchor", "middle")
                   .style("visibility", "visible")
               .attr("pointer-events", "none")
                   .text(th.attr("label"));
        })
          .on("mouseout",function(){
             lbl.remove();
            });     

var-lbl；
var svg=d3.选择（“图表”）.追加（“svg”）
.attr（“宽度”，200）
.attr（“高度”，200）；
svg.append（“rect”）
.attr（“x”，50）
.attr（“y”，0）
.attr（“宽度”，50）
.attr（“高度”，50）
.attr（“标签”、“第一行”+“
”+“第二行”）
.样式（“填充”、“黄色”）
.on（“鼠标悬停”，函数（）{
var th=d3。选择（此）；
lbl=svg.append（“文本”）
.attr（“x”，th.attr（“x”）*1+th.attr（“宽度”）/2）
.attr（y），th.attr（y）*1+th.attr（高度）/2）
.attr（“dy”，“0.5em”）
.style（“文本锚定”、“中间”）
.style（“可见性”、“可见”）
.attr（“指针事件”、“无”）
.文本（标签）；
})
.on（“mouseout”，函数（）{
lbl.remove（）；
});     

---

如何以html格式呈现标签

你可以做一个div并给出css

position:absolute

这样，您现在就可以将其定位在顶部和左侧

还可以在div中设置文本，如

.html（“您的html
文本”）

---

工作代码

您可以创建一个div并给出css

位置：绝对

这样，您现在就可以将其定位在顶部和左侧

还可以在div中设置文本，如

.html（“您的html
文本”）

工作代码

看看这篇文章。如果您更改了.text（th.attr（“标签”）；html（th.attr（“标签”））；它将识别
但要将其换行，您必须附加2个文本或使用tspan元素查看此帖子。如果您更改了.text（th.attr（“标签”）；html（th.attr（“标签”））；它将识别
但要将其换行，必须附加2个文本或使用tspan元素

var th=d3.select(this);
               lbl=d3.select("#chart").append("div")
                .attr("class", "tooltip")
                   .style("left", (th.attr("x")*1+th.attr("width")/2) + "px")
                   .style("top", (th.attr("y")*1+th.attr("height")/2) + "px")
                   .html(th.attr("label"));