是否可以在SVG元素中附加div？

Question

我试图在SVG中附加一个HTML div,我试图创建一个图形.我试图使用下面的代码附加它,但是当我使用Firebug检查元素时,div显示在rect元素代码中,但它没有显示在图形UI中.

我正在尝试的方法是否有问题,或者是否无法在SVG中附加div？

    marker.append("rect")
   .attr("width", "50px")
   .attr("height", "50px")
   .append("div")
   .attr("id", function(d) {
      return "canvas_" + d.key.split(" ").join("_");
   })
   .style("width", "50px").style("height", "50px");

Answer 1

你不能将HTML附加到SVG(技术上你可以使用foreignObject,但它是一个兔子洞).此外,在SVG可见元素不能嵌套,所以元素,例如circle,rect,path和这样不能生育的元素.

Answer 2

我也会考虑使用<g>元素,因为它<div>通过分组对象起到类似的作用.更多关于它的信息.

Answer 3

您试图在同一行中附加“ rect”和“ div”。可能就是您失败的地方。签出D3的这些语言。这是一个基于SVG的令人惊叹的库 http://alignedleft.com/tutorials/d3/drawing-svgs/