Vector Fonts

16 Nov 2010 09:23
Last Modified
13 Jan 2013 18:22

I previously mentioned using vector-based fonts, e.g. for deep sky object and star labels. These labels used line-primitives, as shown in Figures 1 and 2.

Roman Font

Figure 1. Line-primitive Roman vector font

Greek Font

Figure 2. Line-primitive Greek vector font

I also wanted to use vector-based fonts with "thick" lines, so needed to expand each line by a given thickness. The steps I used for a basic approach to achieving this are illustrated in Figure 3, using a '>' symbol as an example.

Expanding Line Primitives

Figure 3. Expanding line-primitives to triangle-primitives

The first step is to expand each line-primitive into a pair of triangles of a given thickness. Next, each line is given a semi-circular "cap", with the number of slices defined by a "smoothing" parameter. Rather than using a cap for both the start and end of each line, only a single cap is used at the join between lines. Finally, the number slices drawn for a given cap can be limited by the angle between each line-join, further reducing the vertex and index counts.

Text can now be scaled smoothly, as shown in Figure 4, without the artefacts produced by scaling SpriteBatch raster fonts. One limitation of this approach however, is that text cannot be drawn with transparency since triangles in each character generally overlap.

Vector font scaling

Figure 4. Smooth scaling of vector fonts

Thick Roman Font

Figure 5. Triangle-primitive Roman vector font


Gabriel Reiser
19 Dec 2010 03:03
Hey Dr. Dave... why not just project the object's locations to the screen and use TextureFonts in 2D screen space? That's what I do.
21 Dec 2010 11:33
Hi Gabriel, totally agree with your approach for fonts of known sizes. Aside from my requirement for a set of small fonts using line-primitves, the only reason I expanded them to triangle-primitives was to support a font which could scale from very small to very large. Since I'm scaling vector positions, the "smoothness" of the edges is the same regardless of scale. To arbitraily scale SpriteBatch fonts, I need to pick a very large size for the SpriteFont definition, which doesn't look good when scaled down to be very small.
15 Mar 2011 20:34
These are exactly what I need, how would I get the code for this?
12 Apr 2017 18:58
чудный вебсайт

Add Comment