近年來，數據可視化成為各行各業越來越重要的工具之一。D3是一個非常流行的數據可視化庫，可以使用它來生成各種各樣的圖表。其中一種比較常見的圖表類型是json立向導圖，可以用來展示不同人物之間的關聯關系。

var treeData = [
{
"name": "張三",
"parent": "null",
"children": [
{
"name": "李四",
"parent": "張三"
},
{
"name": "王五",
"parent": "張三"
}
]
},
{
"name": "李四",
"parent": "張三",
"children": [
{
"name": "趙六",
"parent": "李四"
},
{
"name": "劉七",
"parent": "李四"
},
{
"name": "孫八",
"parent": "李四"
}
]
}
];
// 構造樹狀圖布局
var treeLayout = d3.tree().size([height, width]);
// 生成節點和連線
var nodes = d3.hierarchy(treeData[0], function(d) {
return d.children;
});
nodes = treeLayout(nodes);
// 創建節點
var node = svg.selectAll(".node")
.data(nodes.descendants())
.enter()
.append("g")
.attr("class", "node")
.attr("transform", function(d) { 
return "translate(" + d.y + "," + d.x + ")";
});
node.append("circle")
.attr("r", 4);
node.append("text")
.text(function(d) { return d.data.name; });
// 創建連線
var link = svg.selectAll(".link")
.data(nodes.links())
.enter()
.append("path")
.attr("class", "link")
.attr("d", d3.linkHorizontal()
.x(function(d) { return d.y; })
.y(function(d) { return d.x; }));

以上代碼演示了如何使用D3生成一個初步的json立向導圖，其中包含了一些人物之間的關聯關系。通過這個例子可以看到，在D3中生成json立向導圖并不難，只需要構造好數據、設置好布局節點、創建節點和連線即可。