An absolute explanation of PHP's Imagettftext () function

Source: Internet
Author: User
Tags php language italic font
Picture processing is one of the functions of many programs, while text rendering is a basic part of drawing. PHP supports image processing through a number of extension libraries, most commonly used in the GD library, and provides drawing functionality through a series of imagexxx () functions. This article focuses on a very small point: drawing text. People familiar with Win32 know that TextOut () can easily display any text, but in the world of PHP, some things are not easy. 1 detailed explanation of the Imagettftext () function


For beginners in PHP drawing, the first problem is that the imagestring () function does not support the rendering of Chinese characters. This tends to blow the beginner, but don't worry, because there is also a imagettftext () function that can draw UTF-8 encoded strings, which can, of course, draw Chinese characters. However, it is not very simple to use. Let's take a look at its prototype declaration:





A total of 8 parameters, indispensable, and the official documentation of these parameters are not thorough interpretation, here I try to do a more clear explanation:

(1) $image This is the canvas resources, no need to explain;

(2) $size, the official document explanation is that the font size, its length is dependent on the version of the GD library, for GD1 is a pixel, for the GD2 is the pound (point). Now it is generally GD2, so what does this pound mean? This involves basic knowledge of font design.


In short, the pound is a measure of length, and if one inch is divided into 72 parts, each part is 1 pounds. It should be emphasized here that the pound is an absolute physical unit, independent of the display device.


And what about pixels? Pixels are not fixed size, but are resolution-dependent, high-resolution display pixels are small, such as the size of a pixel on the iphone's Retina screen is much smaller than a normal LCD display pixel. However, some things do not exist the concept of resolution, such as a simple bitmap picture, its smallest component is the pixel, itself is by the color value of each pixel is defined. The same picture is displayed on different resolutions of the display, the final size is different.


When manipulating bitmaps, the most accurate and reasonable pixel units, how to draw a 20-pixel size when using the GD2 library? So how many pounds can be equal to 20 pixels? This must be calculated by resolution, and the problem is that the bitmap itself does not have the concept of resolution.


Now return the question, if given $size=20 lbs, then how many pixels will be occupied by Imagettftext () when the drawing is completed. In any case, Imagettftext () will eventually have to translate the text into specific bits.


1 lbs = ppi/72 pixels


This problem is really tricky, and this function will inevitably use a resolution PPI to calculate the rendered pixel area. The GD2 library, however, does not provide any way for users to set or read this resolution. Well, we can only test it. Use different points to draw the text, and then measure the pixels that the text occupies by using the formula:

PPI = (72* number of pixels)/pound value. The experiment concludes that:

1 lb ==>4 pixels, ppi=2882 lb ==>5 pixels, ppi=1803 lb ==>7 pixels, ppi=1684 points ==>8 pixels, ppi=1445 points ==>9 pixels, ppi=129.66 points ==>10 pixels, ppi=1207 lb ==>11 pixels, ppi=113.142857142868 lb ==>12 pixels, ppi=1089 lb ==>14 pixels, ppi=11210 points ==>15 pixels, ppi=10811 pounds ==> 16 pixels, ppi=104.7272727272712 lb ==>17 pixels, ppi=10213 lb ==>18 pixels, ppi=99.69230769230814 lb ==>19 pixels, PPI= 97.71428571428615 lb ==>21 pixels, ppi=100.816 lb ==>22 pixels, ppi=9917 lb ==>23 pixels, ppi=97.41176470588218 lb ==>25 pixels, ppi= 10019 lb ==>26 pixels, ppi=98.52631578947420 lb ==>27 pixels, ppi=97.221 lb ==>28 pixels, ppi=9622 lb ==>29 pixels, ppi= 94.90909090909123 lb ==>30 pixels, ppi=93.91304347826124 lb ==>32 pixels, ppi=9625 lb ==>33 pixels, ppi=95.0426 lb ==>34 pixels, ppi= 94.15384615384627 lb ==>35 pixels, ppi=93.33333333333328 lb ==>36 pixels, ppi=92.57142857142929 lb ==>38 pixels, ppi= 94.34482758620730 lb ==>39 pixels, ppi=93.631 lb ==>40 pixels, ppi=92.90322580645232 lb ==>41 pixels, ppi=92.2533 lb ==>43 pixels, PPI = 93.81818181818234 lb ==>44 pixels, ppi=93.17647058823535 lb ==>46 pixels, ppi=94.62857142857136 lb ==>47 pixels, ppi=9437 lb = = >48 Pixels, ppi=93.40540540540538 lb ==>48 pixels, ppi=90.94736842105339 lb ==>50 pixels, ppi=92.30769230769240 lb ==>51 pixels, ppi=91.841 pounds ==> 52 pixels, ppi=91.31707317073242 lb ==>53 pixels, ppi=90.85714285714343 lb ==>55 pixels, ppi=92.09302325581444 lb ==>56 pixels, PPI= 91.63636363636445 lb ==>57 pixels, ppi=91.246 lb ==>58 pixels, ppi=90.78260869565247 lb ==>60 pixels, ppi=91.91489361702148 lb = = >62 pixels, ppi=9349 lb ==>63 pixels, ppi=92.57142857142950 lb ==>63 pixels, ppi=90.7251 lb ==>64 pixels, ppi=90.35294117647152 lb = = >67 pixels, ppi=92.76923076923153 lb ==>68 pixels, ppi=92.37735849056654 lb ==>69 pixels, ppi=9255 lb ==>70 pixels, PPI= 91.63636363636456 lb ==>71 pixels, ppi=91.28571428571457 lb ==>72 pixels, ppi=90.94736842105358 lb ==>74 pixels, ppi= 91.86206896551759 lb ==>75 pixels, ppi=91.52542372881460 lb ==>76 pixels, ppi=91.261 lb ==>77 pixels, ppi=90.88524590163962 lb = = >78 pixels, ppi=90.5806451612963 lb ==>79 pixels, ppi=90.28571428571464 lb ==>81 pixels, ppi=91.12565 lb ==>83 pixels, PPI= 91.93846153846266 lb ==>84 pixels, ppi=91.63636363636467 lb ==>85 pixels, ppi=91.3432835820968 lb ==>86 pixels, ppi= 91.05882352941269 lb ==>86 pixels, Ppi=89.73913043478370 lb ==>88 pixels, ppi=90.51428571428671 lb ==>90 pixels, ppi=91.26760563380372 lb ==>91 pixels, ppi=9173 lb = = >92 pixels, ppi=90.73972602739774 lb ==>93 pixels, ppi=90.486486486486

It is visible that when the PPI is more than 46 lbs stable at 90 and less than 46 lbs, the PPI has been slightly changed.

So, if you want to draw 20 pixel-sized fonts, you must set the $size parameter to: 14.5 points.

It is also important to note that the $size does not correspond exactly to the size of the font, because the same $size, the space occupied by different characters is not the same. For example, the width of the Chinese character "country" is much larger than the width of the number 1, especially for punctuation, and the half-width and full-width symbols are also different.

In short, using Imagettftext () can not be precisely controlled to the pixel level, only approximate. This is also a small flaw in vector fonts.


(3) $angle is the angle of rotation. This official website explains more clearly, needs to explain has two points: first, the angle unit is the degree rather than the Radian, the second is the rotation center point is the parameter $x, $y.


(4) (5) $x, $y The baseline point of the first character of the string being drawn. Units are pixels. Here comes the basics of font design-the baseline. This point is definitely not the upper-left corner, but what it depends on is how the font used is designed. For Chinese characters in common fonts, such as Arial, Italic, and blackbody, this point is probably located in the lower left part of the font, while the English alphabet and punctuation are different. Such as:










(6) $color The color of the font, not much explanation.


(7) $fontfile font file. This is a file containing TrueType font fonts, such as the Italic font file SIMKAI.TTF. The format of this file is standard and platform-independent. So you can copy the font files of Windows system directly to Linux for use.


(8) $text the string to render. Note that a string that must be UTF-8 encoded is required. When it comes to strings, you have to mention PHP's string data type. Although named string, the PHP language itself does not recognize the various character encodings, it simply considers string as a dynamically growing "byte" array, such as strlen (), which is the number of bytes returned. And we know that in addition to ASCII-encoded characters and bytes are the same, almost no other character encoding characters correspond to one byte, such as the UTF-8 encoding of a Chinese character occupies 3 bytes. As for how to interpret the character encoding, special library functions such as Iconv_strlen () are required. If the string literal is used, then the PHP source file in which it resides must be encoded as UTF-8 storage.


2 Few Tips

(1) The complexity of word processing software

Although this function can display a string, it cannot be used for word processing software, such as word. This function cannot be used, as soon as it involves a problem with it. Because it cannot handle word spacing, it is not possible to achieve the functions of scatter alignment. In addition to each line of "Kinsoku" (for example, can not be located at the beginning of the row) requirements, good word processing is not simple.


The workaround is to first calculate the exact position of each character through a complex formula, and then call this function for each character.


(2) How to display bold fonts

There is no problem with a font file that is bold in itself, as long as you use the bold file. The problem is that many font files are not designed individually for bold. There is also a function in the GD library that can be displayed in bold. Its solution is a little ridiculous, that is, for each character drawn two times, the second time the $x will be the first time $x more than one pixel.

  • Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.