How to centerline a font?

I am trying to find a way to create the centre line that runs inside each character of a typeface. Similar to this screen shot:

I know I can use vector < ofPath > paths = font.getStringAsPoints(myString, vflip, filled); to get the polylines describing the outlines, and to know if a character is made from 1 or multiple polylines.
For example A, e, !, o have two polylines and h, s, c have just one.

I saw this video on how to do it by hand in Illustrator:

An other option would be using @LingDong’s skeleton tracing:

I guess one easy way, if I am not picky about the typeface, is to use https://github.com/tobiaszimmer/ofxHersheyFont

1 Like

Hi @stephanschulz,

I have done it a while ago, but I’m not sure this was the most efficient way of doing it:
my method consisted in finding the angle between the 3 points of the polyline ( with correct angle to get towards the inside), then half it to get the direction towrds the inside of the shape ( made some bevel stuff as you can see it here ).

From there i guess you can draw a line from the point you are testing and the direction of the angle calculated, calling it line1.
Re iterate to get line2 for the next point.
Then get the intersection (intersectionA) of line1 and line2, so that’s the first point of the line to trace.
Iterate this process to find intersectionB, and trace your line that way accross the letter.

I’m sure people will have a more efficient approach for it, as this is pretty basic, but I have approached it this way in the past and it works.

Hope this help.

I can dig the code of the inner angle between 3 points, there is a catch with some arctan, the sign gets lost.

Best,

P

1 Like

I am following your idea a bit.

  • get the normal of each polyline vertex
  • use ofxRaytracer to see where that normal ray intersects with the polyline
  • use half the distance to define center points

It works better when resampling the polylines by spacing.
The end caps still cause some ugliness, like the end of the e.
It’s still remains to be seen how ordered the center points are, in order to draw a continuous line.


1 Like