Создать сетевой график в D3, используя узлы и ссылки

Question

Я работаю над d3.js и пытаюсь создать сетевой график из файла json. Содержимое файла выглядит следующим образом:

{  "nodes": [{"id": "site01", "x": 317.5, "y": 282.5},
{"id": "site02", "x": 112, "y": 47},
{"id": "site03", "x": 69.5,"y": 287},
{"id": "site04", "x": 424.5, "y": 99.5},
],
"links": [
{"node01": "site01", "node02": "site04", "amount": 10},
{"node01": "site03", "node02": "site02", "amount": 120},
{"node01": "site01", "node02": "site04", "amount": 50},
{"node01": "site04", "node02": "site02", "amount": 80}]
}

Мне удалось прочитать файл и создать узлы в положениях x и y. Однако, когда я пытаюсь создать ссылку длины "количество" между узлами, я не могу прочитать значения x и y, соответствующие узлам. Я пробовал некоторые функции

var canvas = d3.select("body")
        .append("svg")
        .attr("width",1000)
        .attr("height",800);

canvas.selectAll("circle")
        .data(data.nodes)
        .enter()
        .append("circle")
        .attr("cx", function (d) {return d.x; })
        .attr("cy", function(d) {return d.y; })
        .attr("r",25);

 canvas.selectAll("line")
        .data(data.links)
        .enter()
        .append("line")
        .attr("x1", function (d) {return d.node01;})
        .attr("y1", function (d) {return d.node01;})
        .attr("x2", function (d) {return d.node02;})
        .attr("y2", function (d) {return d.node02;})
        .style("stroke","#aaa")
        .linkDistance(function(d) {return d.amount;});

Я читал другие посты, но, похоже, ничего из этого не работает. Не могли бы вы, ребята, предложить исправление этой программы. В основном я хочу получить доступ к значениям x и y соответствующего узла.