Having trouble de-skewing svg text on path

Question

I am trying to draw names along an elliptical path on the outside of a table for an HTML5 card game. I have seen this done without skew here, but the text became skewed when I adjusted the s' data attribute to perfectly fit the curve of the table. Is this possible?

My current code is here (notice the path used for the text in black or cyan): http://vedanamedia.com/clients/intuitive-eye/forums/2-svg-text-path/

And this is what I'm going for (notice names neatly following outer curve around the table):

Answer 1

The reason this is happening is because you are designing everything based on a circle in your SVG, but are then stretching it to an ellipse shape. This is what is causing your "skew" problems.

viewBox="0 0 100 100" height="739" width="1086.4872340425532"

If you want to get rid of the skew, make your path curves elliptical rather than semi-circular. Your viewBox should have the same aspect ratio as your width/height.