D3 zoomable treemap - 加载新级别异步？

Question

在此Treemap示例中，整个JSON树从一开始就存在：
http://jsfiddle.net/6p1gayrp/

由于我有一个非常大的数据集，我想在点击时加载每个级别： 单击示例中的“国际关系”应该从远程数据源加载子数组，然后布局矩形。

所以从一个级别开始：

var json = {
    "name": "Sitemap",
    "children": [{
        "name": "International Relations",
        "value" : 700
    }]
}

然后在重新计算布局之前向树中添加更多数据：

var json = {
    "name": "Sitemap",
    "children": [{
        "name": "International Relations",
        "children": [{
            "name": "Systemic Theory",
            "children": [{
                "name": "Great Powers",
                "value": 400,
            }, {
                "name": "Systemic Politics",
                "value": 300,
            }]
        }]
    }]
}

如何在保持其余功能完整的同时加载数据异步？

（理想情况下，这也适用于另一个方向：例如，如果用户直接导航到树形图的特定级别，然后开始向上层次结构。）