svg - d3.js 使用 ForeignObject 平移和缩放

Question

我正在尝试对包含 ForeignObject 的 SVG 应用缩放和平移。

但是当我缩放或平移时，它们的更改不适用于 HTML 部分。当我在 DIV 周围移动元素时，只需保持它们的原始位置，就像外来物体忽略过渡一样。

这就是我所做的：

    var title = viewport.append("g").selectAll(".node-title")
    .data(dataset.nodes)
    .enter()
    .append("foreignObject")
    .append("xhtml:body")
    .html(function(d){return '<div title="'+d.title+'"><div class="node-title">' + d.title + '</div></div>'})
    .attr("class", "node-title")
    .style("top", function(d){return d.y + 2 +'px'})
    .style("left",function(d){return d.x + 6 +'px'});

是定位有问题吗？有什么方法可以强制对这些部分进行更改？