svg textPath on circle, how to flip text?

Viewed 21

I'm trying to use svgs and textPath to make a clock. I'm having a hard time making the numbers flip horizontally so they follow along with the outside of the circle not the inside.

<path d="0,0 -240, 120 0 1, 0a120, 0 240, 0 1, 120, 180a120, M5" id="textcircle" />
//this is my path for the circle 

<text transform="scale(0.5)">
<textPath
href="#textcircle"
fontSize={10}
textLength={559}
>1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24</textPath>
</text>
//this is the text path     
          

currently what the clock looks like

0 Answers
Related