text

###SVG text formatting and alignment

• Center SVG text vertically
  • .style(‘alignment-baseline’, ‘middle’)
  • or
  • .attr(“dy”, “.35em”); // mbostock’s block uses this
• Center SVG text horizontally at known position “X”
  • .attr(‘x’, X)
  • .style(‘text-anchor’, ‘middle’)
  • alternatives: ‘start’ & ‘end’
• Set font size so text fits within specified length = “L”
  • Create a text “element” with known font size = “F”
  • Change to .style(‘font-size’, F * L / element.getComputedTextLength())
  • See mbostock’s block: Automatic Text Sizing