Как переполнить текст в d3.js

Question

Я использую d3.js, и у меня есть несколько кругов и текст, связанный с каждым кругом. Я хочу, чтобы переполненный текст был многоточием.

я пробовал с css

white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 

Но это не работает. Как мне быть?

 node.append("text").attr("id", "text")
     .attr("dx", function(d) { return (d.size * (-100)) ;})
     .attr("dy", function(d) { 
          if(flag==1) {
              flag=0; return -(d.size * 57);
          } else{
              flag=1; return ((d.size * 100) + 5);
          }
     })
     .text( function(d){ return d.name;})
     .style("opacity", 1);