Vector Fonts

By
Dave
Project
Published
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

Comments

By
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.
By
Dave
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.
By
Gordy
15 Mar 2011 20:34
These are exactly what I need, how would I get the code for this?
By
Spomscarve
21 May 2017 17:23
http://eroticpro.ru/shatenka-na-serebristom-divane Шатенка сидит на софе с резной спинкой.
By
Ignaciodex
21 May 2017 20:21
Nice to meet you.
I want to introduce you an amazing binary options trading alarms provider. I want to send you a link to their facebook page,they send the signals for free. No need to open any account, register or deposit money! Try it. They send signals every 15 min 24 hours per day! https://goo.gl/FQmKND
By
ScottWaync
21 May 2017 20:54
l <a href= http://apaydayloancom.com >payday loans online same day</a> right http://apaydayloancom.com ten
By
Serviceqep
21 May 2017 22:23
Привет друзья<a href=http://vika-service.by/>!</a>
Наша компания занимается свыше 10 лет ремонтом и обслуживанием оргтехники в городе Минске.Основные направления и виды нашей деятельности:

1)<a href=http://vika-service.by/>Заправка и восстановление картриджей</a>

2)<a href=http://vika-service.by/>Ремонт и сервис оргтехники</a>

3)<a href=http://vika-service.by/>Ремонт и настройка компьютеров и ноутбуков</a>

4)<a href=http://vika-service.by/>SEO продвижение сайтов</a>

5)<a href=http://vika-service.by/>Разработка сайтов</a>
Всегда рады помочь Вам!С уважением,ЧУП ТЕХНОСЕРВИС ВИКТОРИЯ.
<a href=http://vika-service.by/>картридж не печатает после заправки</a>
<a href=http://vika-service.by/>заказать сео продвижение</a>
<a href=http://vika-service.by/>продвижение раскрутка сайт реклама</a>
<a href=http://vika-service.by/>заправка картриджей с чипом</a>
<a href=http://vika-service.by/>ремонт компьютеров картинки</a>

Add Comment

*
*
*
Captcha
*
*Required