D3, SVG and textPath: How to move the text down?

I've got a diagram with some text written along one of the paths using a textPath. However, my problem is: I need the text to be on the other side of the text path, ie, sitting below it. Here's an example: I need the text here to be within the solid blue area. Ie, so you can actually read it. The blue arc here being the textPath. In other words, I just want to move the text down about 20px. Whats really confusing me, is that I can set an "x" property on the text and move it left and right , but I can't set a "y" property to move it up or down. I can't figure it out. Can anyone help? Here's my code ``` var labels = svg.selectAll("text.label") .data(partition.nodes(data)) .enter() .append("text") .attr("class", "label") .attr("x", 10) .attr("stroke","black") .style("background-color",'white') labels.append("textPath") .attr("xlink:href", function(d) { return '#' + d.name }) .text(function(d) { return d.name.capitalize() }) ```