0
我現在用的力佈局例子here添加標籤強制佈局，其中的數據是唯一的客戶端（D3）
我需要的標籤添加到節點。所有的例子我已經看到了使用這樣的事情：
node.append("text")
.attr("dx", 12)
.attr("dy", ".35em")
.text(function(d) { return d.name });
但是，當有一個被稱爲本地數據，如功能這個工程：
d3.json("graph.json", function(error, json) {
但在我的例子中，數據是所有客戶端因此不需要d3.json來傳遞它。如何在此場景中向每個節點添加標籤？下面是我使用的代碼：
<body>
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
// set a width and height for our SVG
var width = 1000,
height = 800;
// setup links
var links = [
{ source: 'Baratheon', target:'Lannister' },
{ source: 'Baratheon', target:'Stark' },
{ source: 'Lannister', target:'Stark' },
{ source: 'Stark', target:'Bolton' },
];
// create empty nodes array
var nodes = {};
// compute nodes from links data
links.forEach(function(link) {
link.source = nodes[link.source] ||
(nodes[link.source] = {name: link.source});
link.target = nodes[link.target] ||
(nodes[link.target] = {name: link.target});
});
// add a SVG to the body for our viz
var svg=d3.select('body').append('svg')
.attr('width', width)
.attr('height', height);
// use the force
var force = d3.layout.force()
.size([width, height])
.nodes(d3.values(nodes))
.links(links)
.on("tick", tick)
.linkDistance(300)
.start();
// add links
var link = svg.selectAll('.link')
.data(links)
.enter().append('line')
.attr('class', 'link');
// add nodes
var node = svg.selectAll('.node')
.data(force.nodes())
.enter().append('circle')
.attr('class', 'node')
.attr('r', width * 0.01);
// what to do
function tick(e) {
node.attr('cx', function(d) { return d.x; })
.attr('cy', function(d) { return d.y; })
.call(force.drag);
link.attr('x1', function(d) { return d.source.x; })
.attr('y1', function(d) { return d.source.y; })
.attr('x2', function(d) { return d.target.x; })
.attr('y2', function(d) { return d.target.y; });
}
</script>