d3.json 不会立即执行，而是稍后执行

Question

所以我在绘制 d3 图时遇到了并发问题。我的页面在一个图表上运行完美，但在多个图表上出现问题。这是获取json的相关代码。

        json_fetching_id = "json/";
        json_fetching_id += json_ids.splice(0, 1);
        //here is where the d3 is grabbing the json file.
        d3.json(json_fetching_id, function(error, json){
            if (error) return console.warn(error);
            results = results.concat(json);
            callback(results); //the callback function draws the graphs.
         });
        console.info("Retrieving JSON file " + id);

如果我在回调函数中有断点，则代码会正确执行并显示多个图形的预期显示，这让我相信这是一个并发问题。

上面的函数在 for 循环中被调用到我需要绘制的每个数据条目。我担心的是，在调试时，调试器会跳过 d3.json 调用，而不是执行回调函数。它遍历整个 for 循环，不执行回调，然后在 for 循环完成后执行 d3.json 调用->这是我认为并发问题的来源。所以我的问题是，有没有办法确保在进入 for 循环中的下一个项目之前执行 d3.json 及其回调，而不是让它全部在最后执行？

Answer 1

回调函数在浏览器检索到 JSON 文件后异步执行。同时，您的 for 循环继续。这是预期的行为。您需要推迟执行，直到检索到 所有 文件。根据您的偏好和可用的库，您可以使用任何 Promises 库或 jQuery $.Deferred。如果你想坚持 D3.js 生态系统，Mike Bostock 正是为此目的发布了queue.js 库。该库的 README.md 包含一个正是您的用例的示例。