Javascript 在D3.js中完成一个函数之后，如何运行另一个函数？

我正在使用d3.js绘制几个条。绘制完成后，我想更改选定条的颜色，但总是失败。似乎同时调用了

牵引杆（）

和

更新颜色（）

function redraw(data){
    drawBars(data);
    updateColor();
}

如何确保在调用

更新颜色（）

之前完成

牵引杆（）

起初，我在牵引杆的末端添加了更新功能代码，但它不起作用。后来，我把它移到重画函数的末尾，它也不起作用。 这是特定代码：

function drawBar(drawData){
        var w = 1060,h = 600;
        d3.selectAll("svg").remove();
        var svg = d3.select("#chart").append("svg").attr("width",w).attr("height",h);   

        uni.forEach(function(element,index,array){
        $('.uni').css("top",function(index){
                return  (index + 1) * 18 + 28;
            });
        });
        $(".rankingheader").css("display","block");
        $("#switch input").prop("checked", false);
        starData = drawData; 
        revCountData = drawData;
        sentData = drawData;
        bizCountData = drawData;


        drawAxis(drawData);
        drawStar(starData);
        drawRev(revCountData);
        drawSent(sentData);
        drawBiz(bizCountData);
        drawLineA(starData);
        drawLineB(starData,revCountData);
        drawLineC(revCountData,sentData);
        drawLineD(sentData,bizCountData);

                    // cart is a list which stored the id selected by user
        if(cart.length > 0){
                cart.forEach(function(element,index,array){
                    d3.select("#starHoverLine" + element).attr("visibility","visible");
                    d3.select("#starHintText" + element).attr("visibility","visible");
                    d3.select("#revHoverLine" + element).attr("visibility","visible");
                    d3.select("#revHintText" + element).attr("visibility","visible");
                    d3.select("#sentHoverLine" + element).attr("visibility","visible");
                    d3.select("#sentHintText" + element).attr("visibility","visible");
                    d3.select("#bizHoverLine" + element).attr("visibility","visible");
                    d3.select("#bizHintText" + element).attr("visibility","visible");
                    d3.select("#lineA" + element).style("stroke","red");
                    d3.select("#lineB" + element).style("stroke","red");
                    d3.select("#lineC" + element).style("stroke","red");
                    d3.select("#lineD" + element).style("stroke","red");
                    d3.select("#starBar" + element).attr("fill","red");
                    d3.select("#revBar" + element).attr("fill","red");
                    d3.select("#sentBar" + element).attr("fill","red");
                    d3.select("#bizBar" + element).attr("fill","red");
                });
        }

    }

---

您的两个函数不是同时调用的；他们一个接一个地被叫来。如果它们似乎同时被调用，则会发生以下两种情况之一：

牵引杆

正在启动异步完成的东西（如ajax请求或动画），或者

牵引杆

正在进行浏览器未立即显示的更改，您希望在调用

更新颜色

之前短暂返回浏览器以允许其显示（渲染）这些更改

如果是#1，那么您需要查看异步操作的文档，

牵引杆

开始了解如何知道何时完成。通常这是一个回调或承诺。根据它是哪个，您需要将

updateColors

作为参数传递到

牵引杆中（这样您就可以从异步回调调用它），或者让
牵引杆
返回承诺，并使用承诺的
然后
方法将
更新颜色
添加到履行承诺时要调用的函数队列中

如果是#2，那就简单多了：

setTimeout(updateColors, 100); // Wait 100ms (1/10th second) and call `updateColors`

不，它们一个接一个地被调用。
trablers
是否发出ajax请求？如果不是，并且它只是执行内联运行的代码，那么应该执行。您必须显示
牵引杆的代码。要么它做一些异步的事情，在这种情况下，通常异步操作在完成时提供回调或承诺；或者您只需要简单地返回浏览器，让它呈现条形图，在这种情况下，您需要
setTimeout
。现在无法确定是哪一种。如果您想保证在updateColor之前执行牵引杆，请将updateColor（）放在牵引杆（）的最后一行，知道当前代码的执行顺序，请编辑您的问题并提供详细信息，一些需要回答的代码