1

I have a drawing that is edited in one screen - all paths drawn are saved in DB as percentage coordinates (as I know the width and height of the paper).

This is like this because I then display the same drawing in different sizes on other pages (so the percentages can easily be calculated back to real coordinates for each size).

The problem I have is I need to add text to the drawing, and as far as I know there is no way of setting the font size as a percentage it has to be in pixels.

Of course this doesn't work if I edit the drawing in a 900x500 paper then it is displayed in a 450x250 paper - I need it to automatically decrease the font size in proportion to everything else.

Difficult issue to explain - hopefully this is clear to someone Can anyone help? any ideas for a different approach?

Jason
  • 143
  • 1
  • 17
  • You should be able to calculate the font size regardless of its unit of measurement. EG if it was 20px and you had 400x400, then you changed to 200x200 it would be * 0.5 so do a calculation. – Neil Feb 19 '13 at 14:06
  • I understand where you are coming from but how would you calculate the amount if it changed from 900x500 to say 700x400? – Jason Feb 19 '13 at 16:37
  • 2
    Rather than modifying the font-size, you could simply scale the text elements into the correct aspect. For instance, given a center point of the element defined by `cx`,`cy`, you would apply { transform: [ "S", new_width / old_width, new_height / old_height, cx, cy ] }. This would scale the text differently on the x and y axes based on the difference between the current display dimensions and the original ones. – Kevin Nielsen Feb 19 '13 at 17:37
  • @KevinNielsen - liking your idea a lot - just one thought though would that mean that the text could be squashed/stretched after scaling? – Jason Feb 20 '13 at 16:20
  • Yes, the algorithm I threw down would definitely stretch the text *if* the dimensions of the new image have a different aspect ratio than the first one -- just as would your percentage-based elements. If you're interested in preserving text aspect ratio regardless of the environment aspect ratio, you could just do { transform: [ "S", Math.min( new_width / old_width, new_height / old_height ), Math.min( new_width / old_width, new_height / old_height ), cx, cy ] }. That would basically scale the text relative to the smallest dimensional change =) – Kevin Nielsen Feb 20 '13 at 22:55

0 Answers0