svg 树状图_树状图(关系图)

树状图(竖着)

d3.json("city.json", function (err, data) {

const width = 700, height = 800, padding = {top: 60, left: 30};

const svg = d3.select("body").append("svg")

.attr("width", width + padding.left * 2)

.attr("height", height + padding.top * 2).append("g")

.attr("transform", "translate(40,50)");

const tree = d3.layout.tree()

.size([width, height - 200])

.separation(function (a, b) {

//点与点之间的间隔比例

return a.parent === b.parent ? 1: 2;

});

// nodes:

// [{name: "中国",

// children: Array(3),

// depth: 0,

// x: 350,

// y: 0}

// ,...]

const nodes = tree.nodes(data);

// links:

// [

// {source:node,

// target:node}

<