0

I have a circle in a svg which is this

<circle style="fill:none;" cx="203.00464" cy="289.69531" r="91.29858"/>

I want to add some text inside this circle to the top left most point of the circle to the bottom most right point inside the circle. I am able to add the text just fine however I'm struggling with the maths of how to get the text to fit perfectly inside the circle. All I know is what is above inside the <circle> but these can vary from one svg to another.

I am able to display the text because I have a <div> element that displays inside of a foreignObject. This displays fine its just the position and sizing I'm finding hard because currently everything is manual which is not ideal

How do I work this out I'm using javascript and jQuery to do all this as well as snap.svg to do animation.

Mr Lister
  • 45,515
  • 15
  • 108
  • 150
Dan Marks
  • 49
  • 6
  • According to this answer : http://stackoverflow.com/a/6732550/3365426, i'm not sure that it is possible – David H. Feb 25 '16 at 15:46
  • I am able to display the text because I have a
    element that displays inside of a foreignObject. This displays fine its just the position and sizing im finding hard because currently everything is manual
    – Dan Marks Feb 25 '16 at 15:50
  • Just be wary that I don't think foreignObject is well supported, for example I don't think IE supports it for IE11 and below. – Ian Feb 25 '16 at 15:54
  • @Ian Thanks for warning me – Dan Marks Feb 25 '16 at 16:01

0 Answers0