D3.js, force-graph, cannot display text / node label

I cannot display node labels using force layout in d3.js.

I am trying with this example http://d3js.org/d3.v3.min.js

I updated this code only with the addition of scaling, for example:

var svg = d3.select("body").append("svg").attr("width", width).attr("height", height).append('svg:g').call(d3.behavior.zoom().on("zoom", redraw)); function redraw() { console.log("here", d3.event.translate, d3.event.scale); svg.attr("transform", "translate(" + d3.event.translate + ")" + " scale(" + d3.event.scale + ")"); node.attr("transform", function(d) { return "translate(" + dx + "," + dy + ")"; }); } 

Why are tags not showing?

+8
graph data-visualization labels force-layout
source share
1 answer

You need to add text separately:

 node.append("text") .attr("dx", ".10em") .attr("dy", ".10em") .text(function(d) { return d.name; }); 

see the following examples:

http://bl.ocks.org/mbostock/2706022

http://bl.ocks.org/mbostock/1153292

+3
source share

All Articles