Have you ever asked how to change the size of the text displayed on elements of a D3JS plot so far? After a bit touch search and discovery, I believe this trick isn’t explicitly addressed in anywhere of D3JS documentation and hasn’t asked in various developers’ communities. Therefore, sharing this experience might be useful for some needing it. Let’s go to see how to do so in 3DJS now.
If you want to change the size of text on D3JS graphs, please add this .style("font-size", "1.5em")
to the elements in question.
var gs = svg.selectAll(".arc") .data(pie(dataset)) .enter() .append("g") .attr("class","arc"); //all arcs
And then adding the following statements
gs.append("text") .attr("transform", function (d) { return "translate(" + arc.centroid(d) + ")"; }) .attr("text-anchor", "middle") .attr("fill", "white") .attr("font-family", "sans-serif") .style("font-size", "1.5em") .text(function (d) { return d.data[1]; });
Hope this small tip will help you very much in your work.
Happy coding!