Outline of a text as single line vector path
Asked Answered
M

1

9

For an application I need to draw text/glyphs as a vector based path. Using GDI+ GraphicsPath and Graphics.DrawPath or WPF FormattedText and Geometry works fine and I get the output as shown in the first picture. But is it somehow possible to get letters as a single line path as shown in the second picture (shows an L).

I'm glad if anyone has an idea.

Text outline Single line glyph path

See this example. Using built-in function will always give you the path of a letter containing it's inner and outer borderline. Only the first one is made of single strokes which results in a much shorter path.

enter image description here

Marianomaribel answered 10/12, 2012 at 9:2 Comment(9)
for a simple project I would take the 2D-coordinates for 1 pixel width and use a A* algorithm to find the "way" around the object.Mientao
See also here but this is for Adobe and CAD apps. The only solution that I found so far are single-line TrueType fonts that have to be installed on the system.Marianomaribel
Can you be more specific? you say a "single like path" then show an image with two lines in it. It's not clear what you're trying to accomplish.Leopardi
I edited my post. See the new picture for details. My goal is to get the shortest path for drawing a letter like an A.Marianomaribel
I'm still not clear what you're asking. Are you looking for the strokes of the glyph (like the strokes someone would make with a pen) rather than the path that makes up its outline?Garbanzo
Why don't you use single line fonts (open type or true type)? A quick google on this brings a lot, for example: mrrace.com/CamBam_Fonts or forums.macrumors.com/…Puberty
Cool, thanks for the links. I googled for them but never found good ones. I will try them because I'm not sure how the built-in functions from C# (GDI+, WPF) will handle them.Marianomaribel
@Marianomaribel - WPF is vector based, so it should be interesting. PS: don't forget to add a recipient to your comments ('@' followed by user name). I wasn't aware you answered me.Puberty
I tried the single-line-fonts but the GDI+ function still returns a double path, meaning the way around the letter. Only for T and other simple ones, this solution works.Marianomaribel
T
8

Single stroke fonts define themselves by the filled area of the font. TTF (outline) fonts define each character by the stroke surrounding the filled area. So, they necessarily form a closed shape. In other words, it's not possible to have a "true single stroke" outline font, because single stroke fonts only have a filled area. The .NET Framework only supports TTF fonts.

Luckily, there are some fonts that emulate single-stroke behavior by closing the outline strokes in on themselves. Mostly, they are used by CNC plotting software. Here is a link to the zip file containing the same fonts that @Simon Mourier suggested using.

I experimented with the first one and indeed I could not see a separate path for the enclosed areas. I did write some code that makes the strokes of a regular font close in on themselves, but the curved areas disappear in some spots. Whatever internal algorithm .NET uses to try to create a 1px path from a squashed outline just doesn't work as well as using a well designed font. So, this is as good as it's going to get using .NET.

You can use this code to see what each font produces after you install them. Or, I guess you could just try them in your software :) Either way, I hope this is useful for you.

This is the output of Graphics.DrawPath, NOT Graphics.FillPath.

enter image description here

    private void button1_Click(object sender, EventArgs e) {
        DrawText("single stroke ttf engraving fonts");
    }

    private void DrawText(string text) {
        using (Graphics g = panel.CreateGraphics())
        using (Font font = new System.Drawing.Font("1CamBam_Stick_1", 50, FontStyle.Regular))
        using (GraphicsPath gp = new GraphicsPath())
        using (StringFormat sf = new StringFormat()) {
            sf.Alignment = StringAlignment.Center;
            sf.LineAlignment = StringAlignment.Center;

            gp.AddString(text, font.FontFamily, (int)font.Style, font.Size, panel.ClientRectangle, sf);
            g.Clear(Color.Black);
            g.DrawPath(Pens.Red, gp);
        }
    }

Also, Here is a very related article to read if you plan on doing alot of this. http://tipsandtricks.rolanddga.com/software/how-to-generate-single-line-fonts-for-use-with-dr-engrave/

Tearle answered 22/12, 2013 at 23:2 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.