Question

我正在使用D3并尝试将一些HTML放入矩形中。目前我的代码如下所示：

node.append("foreignObject")
            .attr("display", "block")
            .attr("dy", ".35em")
            .attr("transform", null)
            .html(function(d) { return sidebarInformation(d); })
            .attr("x", 12)
            .attr("y", 12)
            .attr("text-anchor", "start");

function sidebarInformation(_element){ return '<div>foobar</div>'; }

这可以按照预期在chrome按预期工作，但无法呈现＆＃39; foobar＆＃39;在Firefox中。我尝试过使用.attr("requiredExtensions", "http://www.w3.org/1999/xhtml").append("xhtml:div")

但也没有成功。我有什么明显的遗失吗？

Answer 1

您没有宽度和高度属性。它们在SVG 1.1（Firefox实现）中是必需的。

SVG 2建议使用不同的大小调整机制，其中宽度和高度映射CSS属性。 Chrome / Opera已经实现了这一点，但我还没有想到任何其他UA。

D3JS foreignObject无法在Firefox中呈现

1 个答案: