2

I want to pull up the firstname & lastname from json database & it should be shown in two lines.....

What needs to be changed in the below code ?

.text(function(d) { return d.firstname +"<br/>"+ d.lastname;});

Prakash Patil
  • 107
  • 2
  • 12
  • 6
    Use tspan within text see http://stackoverflow.com/questions/19791143/how-to-dynamically-display-a-multiline-text-in-d3-js – Cyril Cherian May 16 '16 at 09:48
  • You would have to use foreign object and tspan as Cyril has said or split it into multiple text elements so one for first name and one for last and position accordingly – thatOneGuy May 16 '16 at 09:52
  • http://stackoverflow.com/questions/35868310/d3-js-how-to-add-value-below-the-label-in-donut-chart/35869583#35869583 this will also help add tspan with x and dy – murli2308 May 16 '16 at 12:57

1 Answers1

1

I think you cannot directly add an html element directly.

You can use foreignObject.

svg.append("foreignObject")
  .attr("width", "50px")
  .attr("height", "50px")
  .append("xhtml:div")
  .html(function(d) { 
    return (d.firstname + " <br>  "  + "     " + d.lastname);
  });
riteshmeher
  • 854
  • 8
  • 16