d3嵌入式SVG在firefox中的绘制方式与Chrome中的不同

Question

我已经看过这个问题的版本，但他们还没有帮助我解决这个问题。我正在使用嵌套svg的d3，这是代码：

var svg = d3.select("body").append("svg")
        .attr("width", width)
        .attr("height", height);

var nestedSVG = svg.append('svg') 
        .attr("width", innerWidth)
        .attr("height", innerHeight)
        .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

nestedSVG使内部高度/宽度成为适当的截断点。这在firefox中完美运行，但在Chrome中却不行。当我在firebug中滚动嵌套的SVG时，它会显示相应的尺寸，但是当我在chrome中的javascript控制台中滚动嵌套的SVG时，尺寸会被更改。这导致图不同。有关为什么会发生这种情况的任何线索？

Answer 1

在<svg>元素上设置变换的能力是SVG 2中的新功能，尚未得到广泛支持。 Firefox确实支持它，IE目前还不支持其他UA。