Centering curved text on a line in an SVG

I have created a half-circle path as an SVG in illustrator, I want to center the text along this path and the text will be dynamic so I basically need the text to always start in the center (bottom most point of the curve). I have this most of the way there but the text is still off-kilter a bit. The properties I have tried are x="50%" y="50%", dominant-baseline="middle", and text-anchor="middle"

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 2" viewBox="0 0 500 500">
  <g data-name="Layer 1">
    <path d="M0 0h500v500H0z" style="fill:none"/>
    <path id="curved-text" d="M63 250c0 103.55 83.95 187.5 187.5 187.5S438 353.55 438 250" style="stroke:#000;fill:none"/>
    <text font-size="30" fill="#000000" letter-spacing="2" font-family="sans-serif" font-weight="bold" x="50%" y="50%" dominant-baseline="middle" text-anchor="middle">
      <textPath xlink:href="#curved-text">This is my centered text</textPath>
    </text>
  </g>
</svg>

<!-- end snippet -->

The text ends up being more to the left of the bottom anchor than it should be.

You can use the startOffset attribute on the textPath and give it the value 50%.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 2" viewBox="0 0 500 500" style="height:220px">
  <g data-name="Layer 1">
    <path d="M0 0h500v500H0z" style="fill:none"/>
    <path id="curved-text" d="M63 250c0 103.55 83.95 187.5 187.5 187.5S438 353.55 438 250" style="stroke:#000;fill:none" />
    <text font-size="30" fill="#000000" letter-spacing="2" font-family="sans-serif" font-weight="bold" dominant-baseline="middle" text-anchor="middle">
      <textPath startOffset="50%" href="#curved-text">This is my centered text</textPath>
    </text>
  </g>
</svg>

<!-- end snippet -->