SVG Textの縦方向描画位置を調整する - Qiita

SVG Textの横方向の描画位置を調整する手段としてtext-anchor属性があります。text-anchorを使うことで、x=0の点をtextの左端、中央、右端に変更することができます(以下参照)。 text-anchor SVG Textのtext-anchor属性をつかってみた。 同じように、縦方向の描画位置を調整する、すなわちy=0の点がtextのどこにあたるかを調整する属性としてdominant-baselineを使うことができそうです。 text-anchorには12種類の値を設定することができます。D3.jsを使って全パターンを描画させてみました。 var texts = [ 'abcdefg', 'ほげほげ' ]; var params = [ 'auto', 'use-script', 'no-change', 'reset-size', 'ideographic',