In my previous post, we can see the image – replacement technique being applied to mathematical formulas rendering. Replacing text by image can be seen in various Web’s techniques, mainly to display things that browser can’t! It’s a possibility that many Web technologies would never converge into common “form factors”: how many years have passed but SVG is still not supported on all browsers, how font technologies are still fighting stiffly with each other? Various issues would always remain unresolved and image replacement, though ugly and inconvenient, could be used as a temporary solution.
As you can see in the image above: the first line is a popular Chinese straight – stroke font that can be seen on most browsers, the next lines are nice calligraphy (brush – stroke) fonts that can hardly be seen on the web! I’m going to try using FreeType2 for a very specific problem: rendering Chinese fonts, the only reason is just simple: aesthetics! Searching around, I can’t find any simple, standalone solution: nice Chinese fonts are very big, a typical ttf file has size from 5MB to 50MB depending on the character set and quality (with that size, it’s obvious that we should use a server side solution). Packages like Pango or Cairo are too complex, and would require additional dependencies (which is unavailable on a free Linux host).
It takes me a whole day struggling with FreeType2’s reference and manual to get it work with Chinese fonts (quite different from conventional Latin fonts indeed), and finally here it is! You can access the executable at: http://tkxuyen.com/freetype2.php with the following syntax: freetype2.php ? text=… &font=… &size=… &color=… here is an example. Below are renderings with different sizes (anti – alias works really well):
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=11&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=12&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=13&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=14&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=15&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=16&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=18&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=18&color=111111
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=19&color=111111
and renderings with 3 different Chinese fonts (very big files, installed on server) and in different colors. Just note these fonts are a bit non-standard: they produce traditional Chinese characters as output, but only accept simplified Chinese as input:
text=洛阳城东桃李花飞来飞去落谁家&font=2&size=19&color=FF1111
text=洛阳城东桃李花飞来飞去落谁家&font=1&size=19&color=11FF11
text=洛阳城东桃李花飞来飞去落谁家&font=0&size=19&color=1111FF
Update, Jun 6th, 2021:
Due to some changes on my web-hosting, CGI is disabled for some reason. I really don’t have time to figure out why, so just temporarily remove the Chinese font rendering for now!
FreeType2 is an very handy open source library, it’s available on many flatform: Unix, Dos, Windows, Mac, Amiga, BeOS, Symbian… and it does a very good job of handling typefaces! Since FreeType2’s patent issues have expired since May, 2010, we would see an increasing application of FreeType2 in many areas.
This is my very simple C code (~250 LOC) to experiment with FreeType2: loading font, loading glyph, rendering bitmap, dealing with Unicode… To compile, just something like: gcc gifsave.c freetype2.c -o freetype2.cgi `pkg-config --cflags --libs freetype2`. I hope I can have time to extend the code into a more usable form: multi – line layout, alignment, RTF support, etc… Some restrictions are imposed to protect the server, if some text can’t be rendered (e.g: rendering dimensions are too large), an error image like this is displayed instead:
