d3js append div [英] d3js append div

问题描述

我尝试在节点旁边添加一些弹出消息，但它看起来像任何其他文本svg和图像不能显示与附加。

I tried to add some popup messages next to the node but it looks like anything else then text svg and image cant be displayed with append.

  node.append("text")
      .attr("dx", 16)
      .attr("dy", ".0em")
      .text(function(d) { return d.name });

可以工作并添加文本，但我试图添加一个div并且不可见，node.append div）。有没有什么我在这里失踪？

works and adds the text but i tried to add a div and its not visible, node.append("div"). Is there something i am missing here? also how can i easly get the position of node so i can transfer the attributes to another element.

推荐答案

你不能把属性转移到另一个元素。 HTML元素在SVG中的任何位置，您需要将它们包含在 foreignObject 元素中，请参阅此处。如果在SVG组中包含 text 元素和 foreignObject （ g element）并设置它们的位置，它们应该都显示在同一个地方，而不需要在两者上设置相同的位置。

You can't put HTML elements anywhere in an SVG, you need to enclose them in a foreignObject element, see here. If you enclose both the text element and the foreignObject in an SVG group (g element) and set the position on that, they should both show up in the same place without the need to set the same position on both.

这篇关于d3js append div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！