Javascript 使用D3异步设置svg元素属性

我正在使用D3的（v4）TreeLayout绘制数学公式的抽象语法树。 在一些节点中，我嵌入了MathJax实时呈现的其他SVG，以显示特殊的数学语法

出现的问题是，我想基于异步操作在mainSVG树中设置节点（圆）-半径以匹配subSVG大小

let mainSVG = *appendMainSVG*
...

node.append('circle')
    .attr('r', (d) => {
       CustomES6Class.renderSubSVG(d.data.mathml, (err, subSVG){
         mainSVG.append('g')
                .attr('transform', `translate(${d.x},${d.y})`)
                .html(subSVG);
         const subSVGWidth = subSVG.attr('width');
         ____________________________________________
         I NEED subSVGWidth to be returned to attr(r) 
         but I am inside an async callback
         ____________________________________________
       })
    }

我遇到了d3队列，但异步操作的返回值也在回调中结束

有什么想法吗？

为什么不在异步调用中使用并设置

r

。它还可以帮助您避免使用难以区分的多行箭头lambda函数

node.append('circle')
    .each( function(d){
       CustomES6Class.renderSubSVG(d.data.mathml, function(err, subSVG){
         mainSVG.append('g')
                .attr('transform', `translate(${d.x},${d.y})`)
                .html(subSVG);
         const subSVGWidth = subSVG.attr('width');
         d3.select( this ).attr( 'r', subSVGWidth );
       }.bind( this ))
    })

---

看起来您在

（err，subSVG）

之前丢失了上一个

）

和

函数。