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'});

定位有问题吗？ 有没有办法强制改变这些部分呢？