0

I would like to place an icon (for example from font awesome, or an image) into the middle of the inner circle of DONUT graph - used is NVD3.

Example : enter image description here The black points on the picture are placeholders for where the icons yould appear.

So far I was able to add text with the following code:

d3.select("#pie-svg svg").selectAll(".nv-slice").each(function (d, i) {
    var el;
    el = d3.select(this);
    if (el.select("text").empty()) {
        return el.append('text')
                 .attr('class', "monthText")
                 .attr("x", 5)
                 .attr("dy", 130)
                 .append("textPath")
                 .attr("text-anchor", "end")
                 .attr("startOffset", "25%")
                 .attr("xlink:href", function () { return "#monthArc_" + i; })
                 .text(function (d) { return "lorem ipsulum"; });
    }
});

Thank you very much for your help !

Axel
  • 3,331
  • 11
  • 35
  • 58
Mato.Duris
  • 253
  • 1
  • 4
  • 15
  • Try the accepted answer over here: [Adding FontAwesome icons to a D3 graph ](http://stackoverflow.com/questions/18416749/adding-fontawesome-icons-to-a-d3-graph) – Dallas Apr 20 '17 at 21:54
  • thanks for anwser. using icons inside 'textPath' would not be problem ? – Mato.Duris Apr 20 '17 at 22:13
  • I can make it work inside "text" but not inside "textPath". It would not be problem not to use "textPath" -> but then i need to find way how to put "text" onto inner circle :-/ – Mato.Duris Apr 20 '17 at 22:18

0 Answers0